Skip to content

Instantly share code, notes, and snippets.

@weirdpattern

weirdpattern/.2019.01.09.script-loading-techniques

Created January 10, 2019 03:28
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save weirdpattern/9ed573e049cb01c4a47c391e846ac631 to your computer and use it in GitHub Desktop.
Save weirdpattern/9ed573e049cb01c4a47c391e846ac631 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
.2019.01.09.script-loading-techniques
2019.01.09.script-loading-techniques
Raw
benchmark.html
<html>
<head>
<title>Loading scripts</title>
<script src="script1.js" defer></script>
<script src="script2.js" async></script>
</head>
<body>
<!-- Inline block 1 -->
<script type="text/javascript">
document.querySelector('#test').innerHTML = 'This is a test from inline block 1';
</script>
<div id="test"></div>
<!-- Inline block 2 -->
<script type="text/javascript">
document.querySelector('#test').innerHTML = 'This is a test from inline block 2';
</script>
</body>
</html>
Raw
script1.js
document.querySelector('#test').innerHTML = 'This is a test from script 1';
Raw
script2.js
document.querySelector('#test').innerHTML = 'This is a test from script 2';
Raw
syntax.text
<script [defer|async] src="[js-file]"></script>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment