YSlow: Make JavaScript and CSS external

Recommendations

Lighthouse
Metrics
Audits
PageSpeed (Legacy)
YSlow (Legacy)

Overview

Strategically make JavaScript and CSS external to utilize browser caching.

How does your site score on this recommendation?

Details from Yahoo!

Using external files in the real world generally produces faster pages because the JavaScript and CSS files are cached by the browser.

JavaScript and CSS that are inlined in HTML documents get downloaded every time the HTML document is requested. This reduces the number of HTTP requests that are needed, but increases the size of the HTML document.

On the other hand, if the JavaScript and CSS are in external files cached by the browser, the size of the HTML document is reduced without increasing the number of HTTP requests.

Summary

CSS/JS
Medium
Easy

YSlow recommends:

The key factor is the frequency with which external JavaScript and CSS components are cached relative to the number of HTML documents requested.

  • The best solution generally is to deploy the JavaScript and CSS as external files.
  • If users on your site have multiple page views per session and many of your pages re-use the same scripts and stylesheets, there is a greater potential benefit from cached external files.
  • The only exception where inlining is preferable is with home pages. Home pages that have few (perhaps only one) page view per session may find that inlining JavaScript and CSS results in faster end-user response times.

Read More

Related PageSpeed Recommendations

Cookie Policy

By clicking "Allow All" you agree to the storing of cookies on your device to enhance site navigation, analyze site usage, and assist in our marketing efforts. View cookie details

Deny Allow All
×