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

Flash of un-styled content #36

Open
vhdo opened this issue Jul 22, 2015 · 3 comments
Open

Flash of un-styled content #36

vhdo opened this issue Jul 22, 2015 · 3 comments

Comments

@vhdo
Copy link

vhdo commented Jul 22, 2015

Hi,
Your module is pretty awesome, however i have a little problem, while loading my page for the first time, i have a tiny moment when the css is not yet applied to the html so i can see all the html element without css.
My application is very simple: it has only one module named Homepage that load the homepage of the site.
-> I inject the homepage.css in the stateProvider in the config/homepage.js which is the first file to be load of the module Homepage.
-> In terms of timing the site takes about 550ms to completely load.
-> The homepage.css is load at about 450ms and the homepage.html is load at 550ms. So the css is load about 100ms before the html however i always have this moment without css.

Do you have any ideas how to fix this?
Thanks

@gsans
Copy link

gsans commented Jul 22, 2015

It happens because there's a gap between CSS being available to the browser and before is applied.

You can find more information about this issue here:

In order to fix it you can check regularly document.styleSheets for changes before rendering. Not sure how to apply the fix to angular-css tough.

@vhdo
Copy link
Author

vhdo commented Jul 22, 2015

Thanks gsans for your reply. That's what i'm thinking so for instance, i create the injectCss service and inject in the stateProvider with resolve which is worked well. It would be nice to be able to use resolve with angular-css

@ghost
Copy link

ghost commented Jun 7, 2016

Is this issue resolved with angular-css? Or do we still need to manually fix this issue?

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

No branches or pull requests

2 participants