大家好，我卡颂。 对于长期迭代的React项目，性能是不能忽视的问题。通常我们通过： React-Dev-Tools的Profiler面板 一些第三方工具，比如why-did-you-render 检

提升首屏的加载速度，是前端性能优化中最重要的环节，这里笔者梳理出一些 `常规且有效` 的首屏优化建议 通过对比优化前后的性能变化，来验证方案的有效性，了解并掌握其原理

localStorage 是 HTML5 规范中作为持久化保存客户端数据的方案，localStorage 可以用于数据缓存，日志存储等应用场景。由于 localStorage 本身的一些特性： 使用好 localStorage 并没有那么简单，本文主要介绍其使用的一些最佳实践。…

不同的情况我们可以选择不同的判断语句去写对应的逻辑，但是怎么选择使用哪一个判断语句或其他写法，可以使代码的更优雅或更具有可读性呢？

在我们的开发过程中，总是不可避免的会遇到多 `if` 条件判断或多重 `if-else` 嵌套的问题，导致代码写出来变得很糟糕，掌握这些技巧，能够让我们以一种更加优雅的方式替代丑陋的if-else.

这是MDN上给的官方概念，不用去管它，我粘出来只是为了显得专业点嘛... 重点看这里监听目标元素与其祖先或视窗交叉状态的手段，其实就是观察一个元素是否在视窗可见。 可以看到，交叉了就是说明当前元素在视窗里，当前就是可见的了。 其实就是一个简单的构造函数。 以上代码会返回一个In…

服务端渲染（Server Side Renderinig，SSR）是一项可以在服务端预先生成页面的 DOM 结构（而不是在浏览器端生成）的技术。SSR 的优势就是容易 SEO，首屏加载快，对搜索引擎友

问题描述：1px 的边框。在高清屏下，移动端的 1px 会很粗。 产生原因：首先先要了解一个概念：DPR(devicePixelRatio) 设备像素比，它是默认缩放为 100%的情况下，设备像素和 CSS 逻辑像素的比值。目前主流的屏幕 DPR=2 或者 3。CSS中设置的p…

WebP 是 Google 开发一种同时采用有损和无损压缩的图像格式,于 2010 年 9 月 30 日首次发布, 可用于网页上大量摄影, 半透明和图形图像. WebP 有损压缩的程度是可调的, 因此用户可以在文件大小和图像质量之间自由权衡. WebP 通常平均比 JPEG 和…