1觉吭、分析打包報告插件眷茁、light-house工具檢測枫夺、network請求分析鹦马、
performance.timing分析白屏?xí)r間
performance.timing.domLoading-performance.timing.navigationStart或+new Date()?-performance.timing.navigationStart
分析首屏?xí)r間performance.timing.domComplete-performance.timing.navigationStart或
window.onload = () => { const time = +new Date()-performance.timing.navigationStart?}
2文判、webpack打包速度優(yōu)化
縮小loader解析范圍过椎，適當(dāng)指定include文件，排除exclude文件戏仓，?提取第三方插件庫構(gòu)建為dll文件疚宇，babel-loader設(shè)置選項cacheDirectory:true緩存到node_modules/.cache/babel-loader文件下，若需開啟其他loader文件緩存柜去，建議使用cache-loader緩存模塊到node_modules/.cache/cache-loaderwen文件提升持續(xù)打包速度
3灰嫉、開啟多進程打包thread-loader
4、配置nginx壓縮支持gzip傳輸嗓奢，靜態(tài)資源壓縮讼撒，分包公共引用js/css配合contenthash文件緩存，減少http請求,使用雪碧圖股耽，webp文件根盒，cdn加載，頁面盡量用css動畫或過渡減少重排重繪物蝙，dom操作盡可能脫離文檔流,縮小dom樹構(gòu)建炎滞，避免css,js阻塞，css放head頭部且使用提前加載preload屬性诬乞，js放body尾部册赛，若不著急使用的js用defer，異步async屬性引用js
