<script src> tag in the
<head> <script src="app.js"></script> </head>
The reason is that a
<script src> tag will pause the DOM parser until the script has loaded and executed. This will delay the browser's
A much better default is to load your scripts with a
<script src defer> tag:
<head> <script src="app.js" defer></script> </head>
A deferred script has many useful properties:
- It does not block the browser from rendering content.
- Deferred scripts will run after the HTML was parsed. That means you can query the entire DOM tree with
- Deferred scripts will run before the
DOMContentLoadedevent. That means if your code waits to initialize until
DOMContentLoaded(many libraries do), it will still work.
- If you have multiple deferred scripts, they will run in the order they appear in the HTML, regardless of how long individual scripts take to load.
- You can put your
<head>, meaning browsers can start loading the script file very early.
Flaky tests are tests that sometimes fail for no obvious reason. They are the plague of many end-to-end (E2E) test suites that automate the browser through tools like Capybara and Selenium.
Join our free training event and learn to fix any flaky test suite, even in large legacy applications.