- JS blocks HTML parsing. If the script is external, it will have to be downloaded first. This incurs latency in network and execution.
- Shift `<script>` tags to the bottom.
- Async:
- Scripts that don't modify the DOM or CSSOM can use the `async` attribute to tell the browser not to block DOM parsing and does not need to wait for the CSSOM to be ready.
- Defer JavaScript execution:
- There is also a `defer` attribute available. The difference is that with `defer`, the script waits to execute until after the document has been parsed, whereas `async` lets the script run in the background while the document is being parsed.
- Use web workers for long running operations to move into a web worker thread.
- [Navigation Timing API](https://developer.mozilla.org/en/docs/Web/API/Navigation_timing_API) is a JavaScript API for accurately measuring performance on the web. The API provides a simple way to get accurate and detailed timing statistics natively for page navigation and load events.
-`performance.timing`: An object with the timestamps of the various events on the page. Some uses:
- Network latency: `responseEnd` - `fetchStart`.
- The time taken for page load once the page is received from the server: `loadEventEnd` - `responseEnd`.
- The whole process of navigation and page load: `loadEventEnd` - `navigationStart`.
