Skip to content

Commit 1713063

Browse files
committed
Added loadevents
1 parent 2c42863 commit 1713063

File tree

7 files changed

+212
-2
lines changed

7 files changed

+212
-2
lines changed

.eslintrc

+1-2
Original file line numberDiff line numberDiff line change
@@ -47,8 +47,7 @@
4747
},
4848
"env": {
4949
"es6": true,
50-
"browser": true,
51-
"node": true
50+
"browser": true
5251
},
5352
"extends": "eslint:recommended",
5453
"globals": {

loadevents/index.html

+75
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,75 @@
1+
<!DOCTYPE html>
2+
3+
<!--
4+
Copyright 2017 Google Inc.
5+
6+
Licensed under the Apache License, Version 2.0 (the "License");
7+
you may not use this file except in compliance with the License.
8+
You may obtain a copy of the License at
9+
10+
http://www.apache.org/licenses/LICENSE-2.0
11+
12+
Unless required by applicable law or agreed to in writing, software
13+
distributed under the License is distributed on an "AS IS" BASIS,
14+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
15+
See the License for the specific language governing permissions and
16+
limitations under the License.
17+
-->
18+
19+
<html lang="en">
20+
<head>
21+
22+
<!-- Global site tag (gtag.js) - Google Analytics -->
23+
<script async src="https://www.googletagmanager.com/gtag/js?id=UA-33848682-1"></script>
24+
<script>
25+
window.dataLayer = window.dataLayer || [];
26+
function gtag() {
27+
window.dataLayer.push(arguments);
28+
}
29+
gtag('js', new Date());
30+
gtag('config', 'UA-33848682-1');
31+
</script>
32+
33+
<script src="js/defer.js" type="module" defer></script>
34+
<script src="js/async.js" type="module" async></script>
35+
<script src="js/head.js" type="module"></script>
36+
37+
<meta charset="utf-8">
38+
<meta name="description" content="Simplest possible examples of HTML, CSS and JavaScript.">
39+
<meta name="author" content="//samdutton.com">
40+
<meta name="viewport" content="width=device-width, initial-scale=1">
41+
<meta itemprop="name" content="simpl.info: simplest possible examples of HTML, CSS and JavaScript">
42+
<meta itemprop="image" content="/images/icons/icon192.png">
43+
<meta id="theme-color" name="theme-color" content="#fff">
44+
45+
<link rel="icon" href="/images/icons/icon192.png">
46+
47+
<base target="_blank">
48+
49+
<title>Load events</title>
50+
51+
<link rel="stylesheet" href="../css/main.css">
52+
53+
</head>
54+
55+
<body>
56+
57+
<div id="container">
58+
59+
<h1><a href="../index.html" title="simpl.info home page">simpl.info</a> load events</h1>
60+
61+
<p id="data"></p>
62+
63+
<img src="../images/small.jpg">
64+
<img src="../images/medium.jpg">
65+
<img src="../images/large.jpg">
66+
67+
<a href="https://github.com/samdutton/simpl/blob/gh-pages/video/events" title="View source for this page on GitHub" id="viewSource">View source on GitHub</a>
68+
69+
</div>
70+
71+
<script src="../js/lib/ga.js"></script>
72+
<script src="js/end.js" type="module"></script>
73+
74+
</body>
75+
</html>

loadevents/js/async.js

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
/*
2+
Copyright 2017 Google Inc.
3+
4+
Licensed under the Apache License, Version 2.0 (the "License");
5+
you may not use this file except in compliance with the License.
6+
You may obtain a copy of the License at
7+
8+
http://www.apache.org/licenses/LICENSE-2.0
9+
10+
Unless required by applicable law or agreed to in writing, software
11+
distributed under the License is distributed on an "AS IS" BASIS,
12+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
See the License for the specific language governing permissions and
14+
limitations under the License.
15+
*/
16+
17+
'use strict';
18+
19+
import {log} from './log.js';
20+
21+
log('async script executed');

loadevents/js/defer.js

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
/*
2+
Copyright 2017 Google Inc.
3+
4+
Licensed under the Apache License, Version 2.0 (the "License");
5+
you may not use this file except in compliance with the License.
6+
You may obtain a copy of the License at
7+
8+
http://www.apache.org/licenses/LICENSE-2.0
9+
10+
Unless required by applicable law or agreed to in writing, software
11+
distributed under the License is distributed on an "AS IS" BASIS,
12+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
See the License for the specific language governing permissions and
14+
limitations under the License.
15+
*/
16+
17+
'use strict';
18+
19+
import {log} from './log.js';
20+
21+
log('defer script executed');

loadevents/js/end.js

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
/*
2+
Copyright 2017 Google Inc.
3+
4+
Licensed under the Apache License, Version 2.0 (the "License");
5+
you may not use this file except in compliance with the License.
6+
You may obtain a copy of the License at
7+
8+
http://www.apache.org/licenses/LICENSE-2.0
9+
10+
Unless required by applicable law or agreed to in writing, software
11+
distributed under the License is distributed on an "AS IS" BASIS,
12+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
See the License for the specific language governing permissions and
14+
limitations under the License.
15+
*/
16+
17+
'use strict';
18+
19+
import {log} from './log.js';
20+
21+
log('script at end of page executed');

loadevents/js/head.js

+41
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,41 @@
1+
/*
2+
Copyright 2017 Google Inc.
3+
4+
Licensed under the Apache License, Version 2.0 (the "License");
5+
you may not use this file except in compliance with the License.
6+
You may obtain a copy of the License at
7+
8+
http://www.apache.org/licenses/LICENSE-2.0
9+
10+
Unless required by applicable law or agreed to in writing, software
11+
distributed under the License is distributed on an "AS IS" BASIS,
12+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
See the License for the specific language governing permissions and
14+
limitations under the License.
15+
*/
16+
17+
'use strict';
18+
19+
import {log} from './log.js';
20+
21+
log('script in head of page began execution');
22+
23+
document.addEventListener('load', (event) => {
24+
console.log(event.target.constructor.name);
25+
if (event.target.src) {
26+
log(event.target.constructor.name, event.target.src);
27+
}
28+
}, true);
29+
30+
window.onload = () => {
31+
log('window load event');
32+
};
33+
34+
document.addEventListener('loaded', function() {
35+
log('window loaded event');
36+
});
37+
38+
document.addEventListener('DOMContentLoaded', function() {
39+
log('window DOMContentLoaded event');
40+
});
41+

loadevents/js/log.js

+32
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,32 @@
1+
/*
2+
Copyright 2017 Google Inc.
3+
4+
Licensed under the Apache License, Version 2.0 (the "License");
5+
you may not use this file except in compliance with the License.
6+
You may obtain a copy of the License at
7+
8+
http://www.apache.org/licenses/LICENSE-2.0
9+
10+
Unless required by applicable law or agreed to in writing, software
11+
distributed under the License is distributed on an "AS IS" BASIS,
12+
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13+
See the License for the specific language governing permissions and
14+
limitations under the License.
15+
*/
16+
17+
'use strict';
18+
19+
const data = document.querySelector('p#data');
20+
const start = Date.now(); // for browsers that don't support window.performance
21+
22+
export function log(...args) {
23+
const message = args.join('<br>');
24+
let time;
25+
if (window.performance) {
26+
time = (window.performance.now() / 1000).toFixed(3);
27+
} else {
28+
time = ((Date.now() - start) / 1000).toFixed(3);
29+
}
30+
data.innerHTML += `<span class = "time">${time}</span> s:<br>${message}<br><br>`;
31+
}
32+

0 commit comments

Comments
 (0)