Front-End-Performance-Checklist
Front-End-Performance-Checklist copied to clipboard
Inline/async <script> should be placed BEFORE <link rel="stylesheet">.
According to the talk FaCSSt—CSS and Performance @ 39:35 about loading CSS and JS,
Example from the talk:
<link rel="stylesheet" href="…">
<script>
var script = document.createElement('script')
script.src = '…'
document.getElementByTagNames('head')[0].appendChild(script)
</script>
Since a <script>
may alter the CSSOM of the previous <link>
tag, the browser will not execute the <script>
tag until all stylesheets declared beforehand finished loading.
Hey @dtinth, are you proposing a change or a new rule?
In this case, I think it would be a new rule: Put analytics tracking script before <link rel="stylesheet">
.
@dtinth - This is true to any script which requires a download and not just "analytics tracking script", so a more general rule would be preferred
This issue has been automatically marked as stale because it has been open 40 days with no activity. Remove stale label or comment or this will be closed in 10 days. Thank you for your contributions!
This issue was closed because it has been stalled for 10 days with no activity. You can always contact the maintainers directly for more information.