
前端性能优化
艾欢欢
这个作者很懒,什么都没留下…
展开
-
vue-cli3项目打包优化
原始包大小 以下主要操作都在文件 vue.config.js 下进行,如没有此文件,就在项目根目录下新建。 1.去掉 .map 文件 .map 文件的作用:项目打包后,代码都是经过压缩加密的,如果运行时报错,输出的错误信息无法准确得知是哪里的代码报错。 有了 .map 就可以像未加密的代码一样,准确的输出是哪一行哪一列有错。 操作: module.exports = { // ... ...原创 2020-01-02 14:59:13 · 1881 阅读 · 0 评论 -
【前端性能优化】02--vue性能优化
template 语义化标签,避免乱嵌套,合理命名属性等等标准推荐的东西就不谈了。 模板部分帮助我们展示结构化数据,vue 通过数据驱动视图,主要注意一下几点 v-show,v-if 用哪个?在我来看要分两个维度去思考问题,第一个维度是权限问题,只要涉及到权限相关的展示无疑要用 v-if,第二个维度在没有权限限制下根据用户点击的频次选择,频繁切换的使用 v-show,不频繁切换的使用 v-if...原创 2019-04-28 14:59:46 · 957 阅读 · 1 评论 -
【前端性能优化】03--JS节流、防抖的理解和实现
理解 节流 节流,就是拧紧水龙头让水少流一点,但是不是不让水流了。想象一下在现实生活中有时候我们需要接一桶水,接水的同时不想一直站在那等着,可能要离开一会去干一点别的事请,让水差不多流满一桶水的时候再回来,这个时候,不能把水龙头开的太大,不然还没回来水就已经满了,浪费了好多水,这时候就需要节流,让自己回来的时候水差不多满了。 在JS里典型的场景就是,图片懒加载监听页面的scoll事件,或者...原创 2019-04-12 09:42:15 · 864 阅读 · 0 评论