性能优化
文章平均质量分 82
铁锅炖大鹅努力学习前端中
保持对学习的热情。
展开
-
webpack和vite的热更新原理
理解webpack和vite的热更新原理:区别:vite是直接启动开发服务器,请求哪个模块再对该模块进行实时编译。而webpack会先打包,然后启动开发服务器,请求服务器时直接给予打包结果。由于现代浏览器本身就支持ES Module,会自动向依赖的Module发出请求。vite充分利用这一点,将开发环境下的模块文件,就作为浏览器要执行的文件,而不是像webpack那样进行打包合并。由于vite在启动的时候不需要打包,也就意味着不需要分析模块的依赖、不需要编译,因此启动速度非常快。原创 2023-02-22 15:22:58 · 513 阅读 · 0 评论 -
性能优化之后端返回10万条数据,前端如何进行优化
之后,我们可以使用 setTimeout 顺序渲染页面,一次只渲染一个页面。实际上,我们可以先创建一个文档片段,在创建了 div 元素之后,再将元素插入到文档片段中。这样做还可以提高页面性能。在渲染页面的时候,我们可以使用requestAnimationFrame来代替setTimeout,这样可以减少reflow次数,提高性能。所以我们可以采用延迟加载的策略,根据用户的滚动位置动态渲染数据。好的,这就是我们的前端页面模板代码,我们开始渲染数据。分页后,数据可以快速渲染到屏幕上,减少页面的空白时间。转载 2023-01-30 17:26:26 · 353 阅读 · 0 评论