Ask Yoast: technical SEO

Ask Yoast
Still minify and concatenate CSS and JS files?

Ask Yoast: Still minify and concatenate CSS and JS files?

To work properly, websites contain multiple CSS and JavaScript files. These must be fetched from the server by the visitors’ computer, to load a webpage fully. In the old standard, HTTP/1, only one request at a time could be handled, so minifying and concatenating multiple files was a good idea. Otherwise, visitors would experience a slow website because of too many requests. The new standard, HTTP/2, allows for much easier communication between a visitor and the server.

So, does this increasing move to HTTP/2 mean that it’s no longer necessary to minify and concatenate your CSS and JS files? After all, site speed is still crucial for SEO. Let’s get into that in this Ask Yoast!

Want to bump your SEO to a higher level? Become a technical SEO expert with our Technical SEO training! »

Technical SEO 1 training Info

Danny O’Neill emailed us his question:

‘With the increasing move to HTTP/2 should we still minify and concatenate our CSS and JS files?’

Watch the video or read the transcript further down the page for my answer!

Is it still necessary to minify and concatenate your CSS and JS files?

“In the old standard, HTTP/1, the browser could only open so many files at the same time on your server, and thus it was smart to combine those files into larger concatenated files. In HTTP/2 that’s not needed anymore, so no, you don’t necessarily have to do that.

What you need to look at is which portion of your traffic already supports HTTP/2. If that’s the vast majority, then you can stop doing that altogether. Good luck!”

Ask Yoast

In the series Ask Yoast we answer SEO questions from our readers. Have an SEO-related question? Let us help you out! Send an email to ask@yoast.com.

(Note: please check our blog and knowledge base first, the answer to your question may already be out there! For urgent questions, for example about our plugin not working properly, we’d like to refer you to our support page.)

Read more: Performance optimization in an HTTP/2 world »


21 Responses to Ask Yoast: Still minify and concatenate CSS and JS files?

  1. Steven Gliebe
    Steven Gliebe  • 6 months ago

    Thank you. Now I feel better about giving up on minification. It never seemed to be worth the effort (ie. breakage).

  2. Anders Sundstedt
    Anders Sundstedt  • 6 months ago

    Hi,

    Great to know.

    Is there however any particular disadvantage of still minify and concatenate CSS and JS files?

    (since a small amount of my traffic may still be on HTTP/1.

    Thanks

    Anders

  3. Miriam Schwab
    Miriam Schwab  • 6 months ago

    Thanks for the tip! I understand why there would no longer be a need for concatenating files, but why would minification no longer be necessary?

    Also, are there any page speed test tools that take http/2 into consideration? They all seem to yell “Concatenate! Minify!” 🙂

    • Edwin Toonen
      Edwin Toonen  • 6 months ago

      Hi Miriam. Joost talks mainly about concatenating files in the video. Minifying is still a valid option since you’re reducing the size of an asset and not combining several assets into one.

  4. David Richard
    David Richard  • 6 months ago

    There are many seo tools available online to optimize your website.

  5. Rick Rouse
    Rick Rouse  • 6 months ago

    I don’t see a downside to minifying and concatenating your CSS and JS files in either case, so why not just leave them? Or am I missing something?

    • Edwin Toonen
      Edwin Toonen  • 6 months ago

      Hi Rick. Minifying is ok, but concatenating files can have unwanted side effects. Google’s Ilya Grigorik wrote a great book called High Performance Browser Networking. In the Optimizing for HTTP/2 chapter he writes:

      “We need to reconsider the use of concatenation and spriting in light of its new pros and cons:
      – Bundled resources may result in unnecessary data transfers: the user might not need all the assets on a particular page, or at all.
      – Bundled resources may result in expensive cache invalidations: a single updated byte in one component forces a full fetch of the entire bundle.
      – Bundled resources may delay execution: many content-types cannot be processed and applied until the entire response is transferred.
      – Bundled resources may require additional infrastructure at build or delivery time to generate the associated bundle.
      – Bundled resources may provide better compression if the resources contain similar content.”

      Of course, there are always exceptions, but generally speaking, concatenating files for delivery over HTTP/2 is not advisable.

      You can read that part here: https://hpbn.co/optimizing-application-delivery/#optimizing-for-http2

      • Rick Rouse
        Rick Rouse  • 6 months ago

        Thanks for that clarification, Edwin. Makes perfect sense now.

  6. Ngan
    Ngan  • 6 months ago

    I can understand the part on combining multiple css/js files, but minify? Doesn’t minifying or compressing the js/css reduces the size of the file, thus faster download?

    • Edwin Toonen
      Edwin Toonen  • 6 months ago

      Hi Ngan. Correct. Joost talks mainly about concatenating files in the video. Minifying is still a valid option since you’re reducing the size of an asset and not combining several assets into one.

  7. Kieron
    Kieron  • 6 months ago

    Thanks for the video. Informative and straight to the point. We’ve shared this internally.

  8. bina
    bina  • 6 months ago

    Thanks for sharing with us all these informative tips in regards to minify js and css
    Been really helpful and I’ll try it out myself to see how it goes.
    Keep up the great work always!

  9. Basit Ansari
    Basit Ansari  • 6 months ago

    Oh thank you for telling me this best article.

  10. Daniel Dan
    Daniel Dan  • 6 months ago

    Just migrated to wordpress today. I love the interface and i hope to learn more about yoast seo plugin.

  11. Tommy Macca
    Tommy Macca  • 6 months ago

    I thought HTTP/2 was implemented by the web-server e.g. it’s a bolt on module for Apache. So I don’t understand what you mean by:

    “What you need to look at is which portion of your traffic already supports HTTP/2.”

  12. Bill Bennett
    Bill Bennett  • 6 months ago

    A useful follow up question is: “How do you know what portion of your traffic already supports HTTP/2”?

    • Guido Walter Pettinari
      Guido Walter Pettinari  • 6 months ago

      Hi Bill!
      To find whether your site is taking advantage of HTTP/2, you can use the developer tools of your browser.
      For Chrome, you need to go in the Network tab of the dev tools, add the Protocol column, and reload the page.
      All resources loaded via HTTP/2 will have the h2 value in the Protocol column.
      Example screenshot => https://d.pr/i/KaawbP.
      Cheers,
      Guido

      • Bill Bennett
        Bill Bennett  • 6 months ago

        Thanks for that. I think I’m all good, but need to check first before making any changes. Now I know how.

    • Thomas Bacon
      Thomas Bacon  • 6 months ago

      Hi Bill, You’d want investigate two things here to start:

      1. Does my site support and default to a connection over TLS (HTTPS)?
      2. What browsers are people using on my site (Google Analytics is a good option here)

      Then, you can look at a site like “Can I use” to check browser support:

      https://caniuse.com/#feat=http2

      From that you can determine what percentage of your traffic supports HTTP/2

      Note that (as of today) only a couple browsers flat-out don’t support HTTP/2, but a few only support it over HTTPS.

      • Thomas Bacon
        Thomas Bacon  • 6 months ago

        After I wrote that comment I realized it’s not totally accurate – while encryption (HTTPS) is not a hard requirement for taking advantage of HTTP/2, I think all browsers currently require it. So, if your site doesn’t support HTTPS then you can’t benefit from HTTP/2 currently. Also of course your web server (NGINX, Apache, etc…) has to have HTTP/2 enabled.

    • Basit Ansari
      Basit Ansari  • 6 months ago

      You can use any tool from internet market.


Check out our must read articles about Technical SEO