夜晚收集者

在基础的 vue 项目中都是默认以前端配置好静态路由 但在一些较为成熟或大型项目中我们会通常会遇到 权限控制 这个问题，这样我们就涉及到动态路由的设置了 特别是一些 后台管理系统项目，需要对

当在部署访问 SPA单页面应用 时 需要一次性加载所有前端资源，导致文件体积较大。这会增加加载时间并增耗用户的带宽 在 vue项目中，会将我们的所有生产环境第三方依赖打包 chunk-ven

上篇讲到，当在部署访问 SPA单页面应用 时 需要一次性加载所有前端资源，导致文件体积较大。这会增加加载时间并增耗用户的带宽 使用了gzip压缩来使代码文件大大缩小，加快加载速度 本篇讲一下

前面两篇说了针对依赖文件的优化来提升速度 这里讲一下如何从加载方式，渲染体验方面进一步提升用户体验效果 1、路由懒加载 路由懒加载，原理其实就是将原来 顶层直接import引入的方式 改为利

当遇到树形结构数据时，返回了不确定层次的树形数据格式，需要将数据渲染出来如何自制封装一个组件来显示 例如拥有这样的tree树形数据结构 一般情况下，遇到树形结构数据使用递归，如果是组件需要递归显

localStorage是我们前端开发人员使用频率较高的api，它允许开发者以键值对的形式在本地永久性地存储数据在游览器，容量比cookie大很多多倍 通常用来缓存各种全局数据，但又因为不会像c

vue 封装图片懒加载vue组件 图片懒加载原理 图片懒加载（Lazy Loading）是一种优化网页性能的技术，它可以延迟网页中的图像加载时间，直到用户需要查看它们时才加载。这样可以减少页面加载时间

vue 封装图片预览组件 图片放大、缩小、旋转功能 1、插入body，制作全局遮罩层、禁止背景滚动 2、定义组件过渡动画 3、结合 transform 实现图片控制

业务场景 需要在原生输入框，或者自定义的样式密码框，屏蔽输入法弹出，弹出自定的数字键盘输入，并实现数据的双向绑定 实现思路 首先构思组件的要实现的功能以及问题，从小到大，再逐一实现，得出一下步骤结论