Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Set prng seed #2503

Closed
NiciusB opened this issue Sep 28, 2018 · 9 comments
Closed

Set prng seed #2503

NiciusB opened this issue Sep 28, 2018 · 9 comments

Comments

@NiciusB
Copy link

@NiciusB NiciusB commented Sep 28, 2018

I use webpack to compile a number of components into different bundles. That means that if I change one single component, users will have every bundle but one cached, and we don't waste bandwidth.
My problem is that I use the sass random function in a couple of them, and that causes their content to change every time I compile the website even if no code has been changed.

If there was a way to always set up the prng seed, this would not happen.
There's a sass class function to set up the seed: http://sass-lang.com/documentation/Sass/Script/Functions.html#random_seed=-class_method

However, I can't seem to be able to run that function with node-sass
I could compile a version of LibSass that always sets up the same seed, but I thought this would be a nice addition anyway, since the sass function is already there

@xzyfer

This comment has been minimized.

Copy link
Contributor

@xzyfer xzyfer commented Sep 30, 2018

@NiciusB

This comment has been minimized.

Copy link
Author

@NiciusB NiciusB commented Sep 30, 2018

@saper

This comment has been minimized.

Copy link
Member

@saper saper commented Oct 18, 2019

@NiciusB can you explain your use case a bit more? Why are you doing this?

@NiciusB

This comment has been minimized.

Copy link
Author

@NiciusB NiciusB commented Oct 18, 2019

We use the random function to generate some decorative elements
(Example: The petals in the header on https://curiouscat.me/Nuno or the rain in the header on https://curiouscat.me/CuriousCat)

Not being able to set the random seed means that every webpack compilation has a different hash for the CSS files that contain the header. I have reduced it's impact by putting them on a separate file, but still it would be nice to have the same hash.
The same effect could be achieved with CSS generated by JS, but it's nice to just do it in sass.

Another use case could be tests, as mentioned in the LibSass issue.

@saper

This comment has been minimized.

Copy link
Member

@saper saper commented Oct 18, 2019

But even if set a random seed - the order of execution of scss files is not guaranteed. How to solve this?

Maybe there should be a way to generate a reproducible hash on file name, class names or whatever to generate stable per-page values?

@NiciusB

This comment has been minimized.

Copy link
Author

@NiciusB NiciusB commented Oct 18, 2019

It's not guaranteed, but does it change randomly? If I add new scss files that don't contain the random function, would it affect the order of execution of my random-containing scss files?

Having per-page stable seeds would be nice. Adding such a feature would be overkill for my use case (assuming that the order of execution is stable enough), but I see how there might be other use-cases that would benefit from it

@saper

This comment has been minimized.

Copy link
Member

@saper saper commented Oct 18, 2019

It may, especially during watching or when we will optimize for speed of the compilation.

How would you like to provide the seed? As a parameter to render, renderSync? Something else?

@NiciusB

This comment has been minimized.

Copy link
Author

@NiciusB NiciusB commented Oct 22, 2019

Sending a "seed" parameter to render that's used to calculate the seed for every file sounds good.

However, I have checked my code (it's been a while) and I seem to be using a custom prng function

const Alea = require('alea')
const cssCustomRandom = new Alea(1)
[...]
functions: {
  'custom-random($min: 0, $max: 1, $precision: 2)': function(min, max, precision) {
    precision = Math.pow(10, precision.getValue())
    const num = Math.floor(cssCustomRandom() * max.getValue() * precision) / precision + min.getValue()
    return new sass.types.Number(num)
  }
}

It's not working as intended since the hash problem persists, but it's most probably due to the changing execution order that you mentioned. This could probably be mitigated by sending an aditional "namespace" parameter.
If that works, my use case could be trivially solved in userland. It might still be a nice to have feature, tho

@saper

This comment has been minimized.

Copy link
Member

@saper saper commented Oct 22, 2019

libsass currently initializes pseudo-random generator once, during the library startup. That would probably need to change if custom seeding is needed, but that also may create trouble for users who expect some reproducibility of results.

There is no notion of a "session" in libsass but we know that not only one file is rendered it once - it also includes mixins and other includes. I am not sure that setting the seed per render call is a good solution for all use cases.

We should have more feedback on how this feature should work to deliver expected results. Otherwise the non-random results may become random again.

Linking #2746 for an example of global state.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Linked pull requests

Successfully merging a pull request may close this issue.

None yet
3 participants
You can’t perform that action at this time.