- 资源合并
- 缓存
- CDN
- 使用 SSR 后端渲染
- 懒加载
<img id='img' src='min.png' lazy-src='max.png' />
var img = document.getElementById('img');
img.src = img.getAttribute('lazy-src');
// 为缓存 DOM 查询
var i;
for(i = 0; i < document.getElementsByTagName('p').length; i++) {
// code...
}
// 缓存了 DOM 查询
var pList = document.getElementByTagName('P')
var i;
for (i = 0; i < pList.length; i++) {
// code...
}
var listNode = document.getElementById('list')
var frag = document.createDocumentFragment();
var x, li;
for(x = 0; x < 10; x++) {
li = document.createElement('li');
li.innerHTML = 'List item' + x;
frag.appendChild(li);
}
listNode.appendChild(frag)
var textarea = document.getElementById('text');
var timeoutId;
textarea.addEventListener('keyup', function() {
if(timeoutId) {
clearTimeout(timeoutId)
}
timeoutd = setTimeout(function() {
}, 500)
})
window.addEventListener('load', function() {
})
document.addEventListener('DOMContentLoaded', function() {
})