Google gives 6 JavaScript Optimization Tricks

Developer Advocate Alan Kent shared six ways to optimize JavaScript. This is to improve the performance of your website.

The first way is to avoid proliferation in the number of JavaScript files on your site. To fix this issue, combines smaller files together to have a single, larger file to download. Another way is to support HTTP2 on your site. It can improve performance without joining files.

The second way is to avoid excessive DNS lookups. Excessive DNS lookups slow down a user’s first visit to your site. To fix it, one should reduce the number of DNS lookups. Google also suggests hosting a copy of externally referenced JavaScript files on one’s own site.

The third way is to reduce or eliminate inefficient JavaScript. This is because it slows down web pages and leads to poor user experiences. To fix this, write JavaScript code differently. Techniques also include profiling existing code. And writing one’s own scaled-down versions of more powerful components.

The fourth way is to eliminate unused JavaScript. Unused JS is a common problem. To fix this, Google recommends a technique called tree-shaking. This gets used to identify JavaScript that gets never called, which is safe to delete. The fifth way is to make sure your JS files remain compressed when downloaded.

Google says compression is an overall win. To fix this, Many web browsers or content management systems have built-in support. This helps to compress downloads if properly configured.

The last way is to set appropriate cache durations for JS code. It is important to check that one’s JavaScript file returns with appropriate cache expiry time headers. This helps browsers avoid the overhead of checking. To fix this, reference files from a shared public location. This would also enhance the caching of commonly used JavaScript files.

“If a user visits sites that reuse the same JS file, the browser can use the previously downloaded copy of the file, which will improve performance.”