This translation has not been editorially reviewed yet. The German version is authoritative. Deutsche Fassung
CO₂ & EmpCo
When is the JavaScript portion of a page too high?
The browser transfers JavaScript and then runs it on the visitor’s device: it reads it, compiles it and executes it. The check reports the finding if JavaScript makes up more than 45 % of the transferred bytes and is also larger than 300 KB.
Why the share only counts from 300 KB
A share on its own would hit light pages: if you save on images and fonts, the JavaScript share rises even though the JavaScript stays the same. That is why the share only counts from 300 KB of JavaScript. Below that, even a high share is little in absolute bytes.
How the finding enters the score
The JavaScript share counts for 15 % of the CO₂ score. If the share is at most 45 % or the JavaScript at most 300 KB, the full 15 points count; with the finding it is 0 points.
What JavaScript costs on the device
An image is decoded once and shown. JavaScript is parsed, compiled and executed, often continuing after loading, for example for animations, tracking or chat windows. On older phones this takes noticeably long and costs battery. Lighthouse, the audit tool in Chrome, shows this work as JavaScript execution time.
Examples
Drop-down menu
<script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
<script>
$(".menue-knopf").click(function () { $(".menue").toggle(); });
</script><details class="menue">
<summary>Menü</summary>
<nav>…</nav>
</details>
<!-- reines HTML; Tastatur und Vorlesesoftware bedienen es von selbst -->- Use the “Coverage” tab in the Chrome developer tools to find out which part of the JavaScript stays unused on the page.
- Remove libraries that are loaded for a small detail only, such as a whole framework for a drop-down menu.
- Split the code: what is needed only on one page or after a click loads only there.
- Check whether tracking, chat and advertising scripts are needed on this page.
