基于Astro建了个面试笔记站点，kira的面试笔记。

虚拟列表是现在比较常用的前端渲染大数据列表的方案，目前也有很多组件库和工具库也都有对应的实现，如vueuse和ahooks的useVirtualList、element-plus的tableV2等。对于初中级前端而言，虚拟列表也是面试的常客了，和面试官聊到性能优化的话题时有时也会涉及到。本文将笔者对虚拟列表的一些认知，以及基于认知给出的实现做下整理。虽说现在网上写虚拟列表的文章非常多质量也非常高了，但对于技术人而言，只有自己进行输出，才能够有更加深刻的理解。

最近行情比较差，在BOSS投了很多简历，给回复的没有几个。今天难得抓住了一次机会，店匠科技的武汉分部收了我的简历，不过要通过了笔试才能面试，笔试的题目是：实现一个Modal组件。我心想：这不是简简单单吗，写个蒙层和对话框，用绝对定位让组件渲染的DOM脱离文档流就行了。结果一提交代码就给面试方拒绝了，连面试的机会都没有，可谓惨不忍睹。

于是我开始思索，问题究竟出在哪里呢？于是我上网冲浪看了下别人的实现，发现别人都使用了ReactDOM.createPortal。说实话，我之前真没见过这个，这还是React v16就有的特性，看完之后的一瞬间我觉得自己特菜。

菜归菜，知识短板要补齐，于是就有了这片文章。

在2年前校招找前端工作的时候，我背了一堆面试题，其中有一些关于SSR的面试题，内容主要是SSR的优点和解决的问题等概念性问题，不过没有实现SSR的方案。 虽然市面上已经有开箱即用的开源SSR方案（Next.js、Nuxt.js），其原理还是有必要去探究清楚的。本文旨在介绍SSR的概念和原理，并提供使用webpack+react和Vite+Vue3搭建SSR项目的完整实战指南。在上述两个项目的代码实现过程中，我参考了一些文章的方案，但发现这些方案并不尽完善，因此我自己也做了一些探索和优化。在本文中，我也会分享这些值得注意的点。

目前就我自己而言用的比较趁手的框架是react，为了回避面试多余的问题，我直接把vue在简历上去掉了（因为加上去似乎也没加多少分，该已读不回还是已读不回）。不过即便是我现在自认为玩react玩的还行，应付面试题还是不大够。所以需要回顾一下比较基础的部分，不管开发用不用的到，因为面试可能要用到。

在React中进行渲染控制来进行优化，实际优化的并不是浏览器渲染 UI 的过程，而是优化前置的js执行过程。在数据量大、数据改变频繁的场景，对不必要的渲染进行控制是非常有必要的。