你的瀑布流还不够懒
无限加载的商品瀑布流是电商最场景的最常用、最重要的组件，因此有一个高性能的瀑布流组件就变得无比重要 使用 Grid 布局，赢在起跑线 Grid 布局实现响应式非常简单，纯 CSS 实现，不依赖 JavaScript，性能优化赢在起点上 使用 IntersectionObserver 实现懒加载 传统的懒加载通过监听 scroll 事件判断目标元素是否接近/出现在可视区，发起异步请求、加载更多的卡片。而现代浏览器可以使用浏览器原生的 In...
解决 antd5 在低版本浏览器中部分 css 样式丢失问题
因为解决 antd5 在低版本浏览器的文章始终没有解决我的问题，或者是不够优雅，因此做了一点整理，希望对你有用，至少对我是有用的 😁😁😁 调查原因 结果是 css 中是 where 在低版本 chrome 浏览器不起作用 然后就去 , 样式不对的浏览器 console 控制台输入 navigator.userAgent 检测浏览器信息，最终结果是 where 不兼容 chrome 88 以下的版本 解决方法 与 antd 有关直接...
【npm进阶】探索npx：一次性执行包的新方式
在现代前端开发中，开发者们需要管理和使用各种各样的npm包。而在此过程中， 作为npm生态系统中的一部分，提供了一种方便的方式来执行本地或远程的npm包。本篇文章将详细介绍 的用途和优势，展示如何使用 来执行本地和远程包，并提供一些实际的npx示例。 引言 在过去，开发者通常会通过全局安装某些工具来使用它们。然而，全局安装不仅会污染全局环境，还可能导致不同项目之间的版本冲突。 是npm 5.2.0引入的一种新工具，旨在解决这些问题。通过...
HTTP缓存：别傻傻不会回答了
前言 在有大量数据交换的应用程序中，我们会采取一些方式将那些实时性要求不高的数据生成副本，并存储在某个相对来说可以快速到达、访问、获取的仓库，这样在需要这些数据的时候可以直接从这个仓库中获取数据。 缓存的目的： 提升数据交换的性能，提高速度。 缓解服务器或数据库的压力。 HTTP 根据是否要向服务器发送请求将缓存规则分为两类：强缓存和协商缓存。 强缓存 在强缓存中，如果命中缓存，则直接从缓存数据库中取出资源，无需再发送请求到服务器上。...
JavaScript中读取文件的各种方法
在JavaScript中，尤其是配合Node.js这样的运行时环境，有多种方式可以读取服务器上的文件。每种方法都有其适用场景和优缺点。今天，我们就来比较几种常见的文件读取方法，看看哪一种最适合你的需求。 太长不看版 如果你在寻找一个快速且简单的方法， 是一个不错的选择，它提供了一个Promise接口，让你能够以现代的异步语法来处理文件读取。然而，如果你更倾向于同步方法，你可能会更喜欢 ，虽然它会阻塞当前线程直到文件读取完成。最后，如果你...
require.context解决img的src属性不能动态链相对路径问题
我有一堆在项目里的图片 想遍历渲染出来（图片都是相对路径） 一顿操作页面报错 在 Vue.js 中， 属性不能直接使用动态链的相对路径，因为 Webpack 的处理方式要求静态资源路径在编译时是已知的。动态路径无法被 Webpack 识别和解析。 使用 Webpack 的 来批量导入图片并在你的 Vue.js 组件中动态引用它们。 （图片文件在 目录下，并且文件名与 中的键一致。例如，如果你有 和 ，它们的文件名应与 中的键一致。） 1...
优化浏览器渲染主线程的 api 都有哪些？怎么用？
为了提高浏览器的性能和用户体验，现代浏览器采用了一些技术来优化主线程的执行。主要有： setTimeout 延迟加载 （使用不当可能适得其反） web worker 多线程 （不能操作dom，主要计算密集型的任务） requestIdleCallback 帧空闲时运行 （react18带🔥的，低优先级任务） requestAnimationFrame 每帧都会运行 （主要做动画效果调优） setTimeout 延迟加载非常常见，但是它...
你知道生成器和迭代器是啥玩意吗
迭代器和生成器 迭代器和生成器是为了完成函数的中断效果而出现的。让原本只能一次性执行完的函数具备分段处理的功能。在本质上，这两者都属于函数的一种。 迭代器 官方介绍：在 JavaScript 中， 迭代器 是一个对象，它定义一个序列，并在终止时可能返回一个返回值。更具体地说，迭代器是通过使用 方法实现 的任何一个对象，该方法返回具有两个属性的对象： ，这是序列中的 next 值；和 ，如果已经迭代到序列中的最后一个值，则它为 。如果 和...
富文本格式粘贴的问题
回到最初的问题，利用富文本编辑器，编写邮件模板，或者说，提供一个编辑器，用来编写邮件。如果说编写邮件而已，大可以在 word 或者其他编辑器里写好内容，但这里的一个特点就是 占位符 。所以说，这是要保持邮件编辑器的功能，然后还能使用占位符。 前面也是利用了 实现了 占位符 ，且具有不可编辑的特点。另外也具有了编辑器的基础功能，如文字大小、颜色、背景、居中、缩进等等。在开发中，只关注于编辑器本身，即这个编辑器能编辑就可以了，忽略了 这个功...