从 V8 中看 JS 性能优化
注意:该知识点属于性能优化领域
在学习如何性能优化之前,我们先来了解下如何测试性能问题,毕竟是先有问题才会去想着该如何改进。
测试性能工具
- 可以通过 Audit 工具 run Audit获得网站的多个指标的性能报告
- 可以通过 Performance 工具了解网站的性能瓶颈
- 可以通过 Performance API 具体测量时间
- 为了减少编译时间,我们可以采用减少代码文件的大小或者减少书写嵌套函数的方式
- 为了让 V8 优化代码,我们应该尽可能保证传入参数的类型一致。这也给我们带来了一个思考,这是不是也是使用 TypeScript 能够带来的好处之一。
项目怎么进行优化
延迟:
CDN
带宽
js延迟、按需加载
var obj ={};
/**
* 按需加载JS
* @param {string} url 脚本地址
* @param {function} callback 回调函数
*/
export function dynamicLoadJs (url, callback) {
if(obj[url]){
callback();
return;
}
obj[url]=true;
var head = document.getElementsByTagName('head')[0]
var script = document.createElement('script')
script.type = 'text/javascript'
script.src = url
if (typeof (callback) === 'function') {
script.onload = script.onreadystatechange = function () {
if (!this.readyState || this.readyState === 'loaded' || this.readyState === 'complete') {
callback()
script.onload = script.onreadystatechange = null
}
}
}
head.appendC