本文详细介绍了 Next.js 提供的预渲染方案，深入浅出地分析了各种预渲染方案的优劣，并针对不同类型的场景提出了方案选择上的建议，非常值得学习！

前言 在写这篇文章的时候，之前有看过一大堆性能优化的文章，对的，每次看到别人写的好的博客最终的归宿不是脑子🧠，而是收藏夹📖，也就导致于当我真正遇到性能问题的时候束手无策，我也真是理解了那句话纸上得来终

为了提高英文水平，尝试着翻译一些英文技术文章，首先就从这个Vue的小技巧文章开始，目前英文版一共22篇。计划用时2~3个月翻译完成。 在上一篇文章中，我们讨论了如何提高大型数据的性能。但是我们还没有测量它提高了多少。 我们可以使用Chrome DevTools 的性能选项来实现…

Vue-Occupy是一个vue指令，能够在数据被加载之前使用一个可配置的色块进行占位，能够有效提升用户体验。 这样，vue-occupy已经被注册为一个全局的指令，你可以在任意.vue文件里面通过v-occupy使用。 在fetch方法返回数据之前，<div v-occupy…

骨架屏可以理解为是当数据还未加载进来前，页面的一个空白版本，一个简单的关键渲染路径。用户会看到一个样式简单，描绘了当前页面的大致框架的骨架屏页面，然后骨架屏中各个占位部分被实际资源完全替换，这个过程中用户会觉得内容正在逐渐加载即将呈现，降低了用户的焦躁情绪，使得加载过程主观上变…

我一直对我负责的项目成员讲，项目交付给客户的前提是不卡，之后是对用户的友好度必须要高。因为无论你的项目做的有多好，如果用着卡，用户终究会不认可，大家估计也是深有体会。随着时代节奏加快，人们趋向于快速便捷，容易上手的事物。 这一点很重要然而又让用户在一般情况下感觉不到，在产品界有…

京东PLUS会员项目是国内第一个电商付费会员项目，正式开通的会员数量已破千万。

在工作中，有时会遇到需要一些不能使用分页方式来加载列表数据的业务情况，对于此，我们称这种列表叫做长列表。比如，在一些外汇交易系统中，前端会实时的展示用户的持仓情况(收益、亏损、手数等)，此时对于用户的持仓列表一般是不能分页的。 在高性能渲染十万条数据(时间分片)一文中，提到了可…

在进行多页面开发的时候，项目刚开始阶段，页面较少，编译速度还能忍受，但是一旦页面增加，多次热更新就造成了内存溢出。 可以看到的是webpack把所有的页面都进行了编译，总体积已经达到了18M，耗时超过1分钟，在热更新的时候这个体积会变得更大，从而占据node的运行内存，导致内存…