
性能优化
文章平均质量分 74
木_林_森
学无止境,一直在路上
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
webpack 打包速度以及 bundle 优化
开发环境 采用vite 的后 ,开发启动从原来的20多s 降低到如今的 0.5 s 以内,体验棒棒的,由于各种兼容性问题,生产打包 还是采用webpack ,为了优化性能,可以采用一下措施首先webapck 升级为 5 首先 安装。webpack-bundle-analyzer 分析打包后的 文件;一 .首先打包速度优化。1. 打包速度优化 cache: { type: "filesystem", // 使用文件缓存 }, 不再需要 cache-loader。 以及。dl...原创 2021-12-05 18:28:55 · 948 阅读 · 0 评论 -
V8 的垃圾回收机制
V8 的垃圾回收机制V8的内存限制新生代内存的回收老生代内存回收增量标记V8的内存限制在64位系统下, V8最多只能分配1.4G, 在 32 位系统中,最多只能分配0.7G。你想想在前端这样的大内存需求其实并不大,但对于后端而言,nodejs如果遇到 一个2G多的文件,那么将无法全部将其读入内存进行各种操作了机器的内存明明有几十G,为什么会有这样的内存限制?究其原因,有以下两方面的原因, 一个是JS单线程的执行机制,另一个是JS垃圾回收机制的限制。首先JS是单线程运行的,这意味着一旦进入到垃圾回原创 2021-12-11 22:39:30 · 865 阅读 · 0 评论 -
前端性能优化--网络缓存
一.缓存位置从缓存的位置上浏览器一般分 内存缓存(Memory Cache),磁盘缓存(Disk Cache)1.Memory Cache:也即内存中的缓存,主要包含的是当前中页面中已经抓取到的资源,例如页面上已经下载的样式、脚本、图片等。读取内存中的数据肯定比磁盘快,内存缓存虽然读取高效,可是缓存持续性很短,会随着进程的释放而释放。 一旦我们关闭 Tab 页面,内存中的缓存也就被释放了,时效性有限。那么既然内存缓存这么高效,我们是不是能让数据都存放在内存中呢?这是不可能的。计算机中的内存一定原创 2021-11-28 16:35:41 · 482 阅读 · 0 评论 -
前端如何查看页面性能
现在讲的最多的就是前端性能优化,手段五花八门,但是首先 怎么量化优化的效果,首屏从10s 优化的1s , 怎么查看 ?前端性能最简单的量化指标 ,白屏时间,首屏时间。白屏时间 网上互相参考的,都是从html head 处打点 减去performance.timing.navigationStart(上一个页面路有关闭,新路有开启开始时间),白屏时间 = firstPaint - performance.timing.navigationStart但是当前的前端系统,大多是基于 vue /r...原创 2021-11-27 22:08:50 · 3659 阅读 · 0 评论 -
前端项目如何找出性能瓶颈
首先作为知识储备需要理一下,性能损耗可能遇到的问题比如大列表的渲染,大量dom的渲染; 大量图片的加载,过多资源的请求,资源体积是否过大,; 代码中有没有耗时的计算操作,或则大量循环.递归 编写的组件过于庞大 层级过深,依赖模块过多等. 思路考虑:基本的优化思路:未对照上面的顺序先从网络加载静态资源上层面 减少请求数,gizp压缩请求资源的体积,过大的第三方库能不能换成轻量级的,或者考虑分包后按需加载,页面能否按路由 懒加载,代码中有没有很耗时的操作循环和递归,过...原创 2021-11-27 22:53:53 · 925 阅读 · 0 评论