SniperCode Sheva
asked on
How to combine and minify CSS and JS files
Hello experts, I need some advices from you in term of combining and minifying CSS and JS files.
Any ideas ?
I use PingDom to check the speed of my website and there they told me to combine my JS and CSS files.
Thank you.
Any ideas ?
I use PingDom to check the speed of my website and there they told me to combine my JS and CSS files.
Thank you.
You can try webpack
There are many ways to skin this cat.
Webpack as mentioned above is one URL (https://webpack.github.io/)
Browserfy is another URL (http://browserify.org/)
However, in my experience packing your JS / CSS files is what you do when you are done optimising other aspects of your site. It does make a difference but it is pointless if there is some other part of your site that is causing a bottleneck.
Have you done an analysis of your site to see where the majority of time is spent loading?
Webpack as mentioned above is one URL (https://webpack.github.io/)
Browserfy is another URL (http://browserify.org/)
However, in my experience packing your JS / CSS files is what you do when you are done optimising other aspects of your site. It does make a difference but it is pointless if there is some other part of your site that is causing a bottleneck.
Have you done an analysis of your site to see where the majority of time is spent loading?
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
Yes I did an analysis of my website and I am getting this :
- Parallelize downloads across hostnames
- Serve static content from a cookieless domain
- Combine external JavaScript
No I mean a network analysis - that is the output of an analyser that is telling you what you can do - it does not tell you what your site is actually doing.
Load your site
Open your console (F12) go to the Network tab and then do a hard refresh (Shift + F5)
Look at the results in the network tab to see where the bottlenecks are.
If the time spent is in downloading many css / js then packing will help - but there may also be other factors that are causing your site to load slowly.
If your network profile suggests that you should investigate Domain Sharding / CDN setups and packing then you can explore those but just because your site does not do those things does not mean they are issues. First step is to understand what your site is doing.
Also bear in mind that with HTTP/2 coming some of these issues are going to fall away.
Load your site
Open your console (F12) go to the Network tab and then do a hard refresh (Shift + F5)
Look at the results in the network tab to see where the bottlenecks are.
If the time spent is in downloading many css / js then packing will help - but there may also be other factors that are causing your site to load slowly.
If your network profile suggests that you should investigate Domain Sharding / CDN setups and packing then you can explore those but just because your site does not do those things does not mean they are issues. First step is to understand what your site is doing.
Also bear in mind that with HTTP/2 coming some of these issues are going to fall away.