前端

Grid布局踩坑总结，别再被这些问题困扰了 用了几年Grid布局，从刚开始的抗拒到现在的重度依赖，中间踩了不少坑。今天把最实用的经验分享出来，都是实战中总结出来的，绝对不是那种官方文档里的理想情况。 ...

PerformanceAPI监控页面性能，折腾了一整天 上周遇到一个需求，要监控页面的加载性能数据，本来以为就是个简单的API调用，结果折腾了一整天才搞明白。这里把踩的坑都记录下来，免得下次再掉进去。...

我的SVG写法，亲测靠谱 搞前端这么多年，SVG这块踩过的坑不少。最早的时候就是直接把设计师给的SVG代码复制粘贴，结果各种尺寸错乱、颜色不对、交互失灵的问题。后来慢慢摸索出了自己的一套最佳实践。 我...

优化前：卡得不行 最近重构了一个离线应用的数据存储模块，用的是WebSQL。说实话，刚开始没太在意性能问题，就是普通的CRUD操作。结果测试的时候发现，批量插入1000条数据要花5秒多，查询个复杂点的...

项目初期的技术选型 最近接手了一个老项目，团队里新来了几个实习生，代码风格五花八门。有些喜欢分号，有些讨厌分号；有些人缩进用2个空格，有些人用4个空格；还有人居然混用了空格和Tab。每次Code Re...

项目初期的技术选型 最近接手了一个电商项目的重构，主要是商品列表页和详情页的优化。页面上有个问题特别明显：一次性加载几百张图片，用户打开页面就是白屏，有时候要等个十几秒才能看到内容。老板看不下去了，让...

Postman环境变量那点破事儿 今天又被Postman的环境变量搞了一脸懵逼，本来以为很简单的事情，结果折腾了快两个小时。主要是项目里有多个环境要切换，本地开发、测试服务器、预发布环境，每次切换都要...

这次要对比的是前端打包工具的几大流派 最近几个项目重构，重新梳理了一下前端打包工具的选择问题。说实话，这几年工具链变化太快了，我也是从 webpack 一路摸爬滚打过来的。现在新项目要不要还用 web...

我的写法，亲测靠谱 用ResizeObserver这么久，我发现很多人还是在瞎写。我先说说我现在固定用的写法： class ResponsiveElement { constructor(elemen...

性能监控的核心数据怎么拿？ 前端性能优化绕不开页面加载时间统计，这个数据直接影响用户体验。我之前做个项目，老板天天问页面到底多快，用户等待时间长不长，后来直接上了Performance API来精确测...

这次项目又碰到了CORS，真是老朋友了 最近接手了一个新的项目，前端Vue + 后端Node.js的架构。项目刚开始没多久就遇到了那个熟悉的老朋友——CORS跨域问题。其实按理说这问题我已经处理过无数...

webpack optimization配置：到底该选哪种压缩方案？ 最近重构项目的时候，又碰到了webpack optimization配置的老问题。说实话，搞了这么多年前端，每次遇到这个问题还是会...

Rust编译失败，Cargo.toml配置搞死我了 昨天遇到一个离谱的问题，Rust项目死活编译不过，各种dependency冲突，折腾了一晚上才搞定。本来以为就是普通的版本问题，结果发现是Cargo...

优化前：卡得不行 上个月做那个电商后台管理系统的商品列表页面，优化前真的是卡得让人怀疑人生。页面上有1000多个商品，每个商品都有删除按钮、编辑按钮、选择框，还有悬停效果。用户一滚动页面就开始卡顿，点...

为什么要做这次对比？ 最近做组件库重构，被Shadow DOM的各种方案搞得有点懵。以前只是零散地用过Web Components，这次深入对比一下不同的实现方案。说实话，这个技术真的是一言难尽，浏览...

一个管理后台项目的路由设计 最近做了个企业级的后台管理系统，说实话嵌套路由这块还是挺折腾的。项目需要实现多个模块的深度嵌套，比如订单管理下面还要分待支付、已支付、已完成这些子状态页，用户管理里也要细分...

项目初期的技术选型 最近接手了一个老项目重构，原本是单页面应用，打包出来15M+，首屏加载慢得要死。客户抱怨了一年多，终于下定决心要优化。说实话，刚看到那个打包体积的时候我都惊了，这玩意儿能跑起来都算...

公共组件开发踩坑记 最近在重构项目的公共组件库，本来以为就是搬砖的活儿，结果搞出了不少意外情况。最大的问题是组件复用性太差，每次用都得改一堆配置项，而且样式冲突、状态管理这些问题接踵而来。 一开始的组...

React项目里CSS Modules配置踩坑记 今天在重构一个老项目的样式系统，准备把全局CSS改成CSS Modules，结果被各种配置搞得很头疼。本来以为就是改个文件后缀名的事儿，没想到折腾了一...

项目初期的技术选型 上个月接了个数据可视化项目，客户需要实时监控用户的操作行为，包括页面停留时间、点击热力图、滚动轨迹这些。说实话刚开始接到需求的时候有点懵，之前做的项目都是简单埋点上报，这次要求的颗...