Chrome DevTools的performance面板可以记录和分析页面在运行时的所有活动。 配合无痕模式，可以避免chrome插件的影响。 1. 录制查看 下面部分是网页快照，浏览器按照一定时间间隔截取。 2. 实时查看 Paint Flashing 高亮显示网页中需要被…

导语：前端智能化，就是通过AI/CV技术，使前端工具链具备理解能力，进而辅助开发提升研发效率，比如实现基于设计稿智能布局和组件智能识别等。本文要介绍的是前端智能化的一类实践：通过计算机视觉和机器学习实

约定式路由，也叫文件路由，就是不需要手写配置，文件系统即路由，通过目录和文件及其命名分析出路由配置。目前许多开源框架都支持，比如：UmiJS、Nuxt.js、vue-auto-routing等等。 以Nuxt.js的约定式路由规范作为讲解示例。 定义带参数的动态路由，需要创建对…

为什么这些个网站UI做的这么漂亮啊？为什么它们的细节这么细啊？交互好、实现棒，很难叫人不收藏啊！！毕竟收藏了，下次都是会来学的🐶

在github有一个包np，似乎能解决上面的问题。 在一定程度上确实是可以。 按照np的发包流程，必须要先提交commit，但有时候，我们只是说想发个测试包给其他小伙伴，因为也不知道是否正确，所以不是很想先commit。 所以我们必须要实现--no-git的功能，即当有这个ar…

vue-devtools 使用了很长一段时间了，使用过程中发现 vue-devtools 下的 vuex 面板功能很厉害，整个页面的状态可以任意切换到之前的一个时间节点，当时只知道时光穿梭这个概念，没有仔细研究，最近决定入坑研究下。 记的之前有个Vue项目有线上bug，因为是线…

最近一个小伙伴问我他们公司的Vue后台项目怎么首次加载要十多秒太慢了，有什么能优化的，于是乎我打开了他们的网站，发现主要耗时在加载vendor.js文件这个文件高达2M，于是乎我就拿来他们的代码看看，进行了一番折腾。最终还是取得了不错的效果。 对于网页性能，如何提升加载速度、等…

开发一个H5的通用架子，让前端同学开箱即用，迅速投入战斗。 按照Vant官网推荐自动按需引入组件，同样，Vant官网中也有对Rem适配的推荐配置，按照官网说明的使用。需要注意的是postcss的配置中，autoprefixer下的browsers需要替换成overrideBro…

前段时间，看到群里一些小伙伴面试的时候被面试官问到这类题目。平时大家开发vue项目的时候，相信大部分人都是使用 vue-cli脚手架生成的项目架构，然后 npm run install 安装依赖，npm run serve启动项目然后就开始写业务代码了。 但是对项目里的webp…