Skip to content
Learn Measure Blog Case studies About
On this page
  • How to minify your JavaScript files
  • Stack-specific guidance
    • Drupal
    • Joomla
    • Magento
    • React
    • WordPress
  • Resources

Minify JavaScript

May 2, 2019 — Updated Jun 20, 2020
Available in: Español, 한국어, Português, English
Appears in: Performance audits
On this page
  • How to minify your JavaScript files
  • Stack-specific guidance
    • Drupal
    • Joomla
    • Magento
    • React
    • WordPress
  • Resources

Minifying JavaScript files can reduce payload sizes and script parse time. The Opportunities section of your Lighthouse report lists all unminified JavaScript files, along with the potential savings in kibibytes (KiB) when these files are minified:

A screenshot of the Lighthouse Minify JavaScript audit

How to minify your JavaScript files #

Minification is the process of removing whitespace and any code that is not necessary to create a smaller but perfectly valid code file. Terser is a popular JavaScript compression tool. webpack v4 includes a plugin for this library by default to create minified build files.

Stack-specific guidance #

Drupal #

Ensure you have enabled Aggregate JavaScript files in the Administration

Configuration > Development page. You can also configure more advanced aggregation options through additional modules to speed up your site by concatenating, minifying, and compressing your JavaScript assets.

Joomla #

A number of Joomla extensions can speed up your site by concatenating, minifying, and compressing your scripts. There are also templates that provide this functionality.

Magento #

Use Terser to minify all JavaScript assets from static content deployment, and disable the built-in minification feature.

React #

If your build system minifies JS files automatically, ensure that you are deploying the production build of your application. You can check this with the React Developer Tools extension.

WordPress #

A number of WordPress plugins can speed up your site by concatenating, minifying, and compressing your scripts. You may also want to use a build process to do this minification up front if possible.

Resources #

  • Source code for Minify JavaScript audit
Last updated: Jun 20, 2020 — Improve article
Return to all articles
Share
subscribe

Contribute

  • File a bug
  • View source

Related content

  • developer.chrome.com
  • Chrome updates
  • Web Fundamentals
  • Case studies
  • Podcasts
  • Shows

Connect

  • Twitter
  • YouTube
  • Google Developers
  • Chrome
  • Firebase
  • Google Cloud Platform
  • All products
  • Terms & Privacy
  • Community Guidelines

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies.