javascript - Optimize CSS Delivery with head.js for Google Page Speed fail -
my page templates have assets javascript array assets list of css, js use in page, eg.:
<!doctype html> <html> .......... .......... <script type="text/javascript"> var assets= ["/css/my.css", "/js/my.js", "/js/other.js"]; </script> <script type="text/javascript" src="/js/head.js" async="async"></script> </body> </html> with head.js (loaded asynchronously), load assets list of page:
// head.core code - v1.0.2 // head.css3 code - v1.0.0 // head.load code - v1.0.3 head.load(assets); now, google page speed on mobile tab (not on desktop) says optimize css delivery of my.css
but my.css loaded asynchronously head.js loaded asynchronously.
what doing wrong?
optimize css delivery need not mean load them asynchronously alone. mean css may bloated , has class may not used render above fold or not on given page itself.
when developer using tool minify css, happens in css across pages bundled , bloated!
one way handle use css inline required render above fold , move rest of css bottom of page. if not can try use google apache or ngnix page speed plugin. https://developers.google.com/speed/pagespeed/module/
Comments
Post a Comment