Flash of un-styled content

[vhdo]

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]

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:

• https://medium.com/opinionated-angularjs/angular-dynamically-injecting-css-file-using-route-resolve-and-promises-7bfcb8ccd05b.
• https://github.com/VIISON/RequireCSS

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]

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]

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