探索用户界面UI元素,在线CSS/HTML/Tailwind实例
汇聚大量开发者和设计师分享的前瞻技术与设计经验。
先看效果,再看代码 做表单的时候,Radio 单选框几乎是绕不开的组件。别看它简单,真用起来各种细节问题一大堆。我之前在一个问卷项目里,光是 Radio 的选中状态和数据同步就折腾了大半天。今天分享几...
又在 Parameters 上踩坑了? 最近重构一个老项目,里面一堆函数参数传得乱七八糟,有的用对象、有的用数组、有的甚至靠 arguments 拼接。我实在忍不了,决定统一一下参数处理方式。结果一查...
又踩坑了,inline注释在压缩后居然影响JS执行? 上周上线前最后一轮测试,突然发现一个奇怪的问题:本地开发一切正常,但打包上线后某个功能直接报错,说“Unexpected token '}'”。我...
我的写法,亲测靠谱 做前端这几年,性能优化从“锦上添花”变成了“上线必过”。我一开始也以为加个懒加载、压缩下图片就完事了,结果线上一跑,Lighthouse 分数还是 40 多,用户反馈“卡得像幻灯片...
又踩坑了,自定义审计规则不生效 上周在搞一个内部工具的性能优化,想用 Lighthouse 的自定义审计(Custom Audit)来检测我们自己的一些业务指标。结果折腾了半天,写好的规则死活不跑,L...
先上代码,能跑再说 我写 Select 组件从来不是从“什么是下拉框”开始的,而是直接撸代码。项目 deadline 压着,哪有时间看文档?下面这个基础版是我亲测有效、在多个项目里复用过的: <...
为什么我要折腾请求队列? 去年做项目时,用户频繁点击“保存”按钮,结果后端收到一堆重复请求,数据库直接炸了。后来加了防抖,但又遇到新问题:有些请求必须按顺序执行(比如先创建再更新),防抖一搞,顺序全乱...
优化前:卡得不行 上个月接手一个老项目,用的是 Next.js + Static Generation(SSG),理论上应该飞快才对。结果一打开首页,Lighthouse 直接给我打了个 42 分,F...
先扔个最简单的弹窗,跑通再说 用户同意这事,说白了就是个“确认框”,但合规要求一多,就变得又臭又长。我一开始图省事,直接用 alert() 弹个“是否同意隐私政策?”,结果被法务同事追着骂——这玩意儿...
又踩坑了,FMP 怎么算都不对 最近在优化一个老项目的性能指标,老板说“首屏加载要快”,我就顺手把 FMP(First Meaningful Paint)加上去了。结果一测,发现数据完全不对劲——明明...
先跑起来再说 上周项目要上线,测试组说 iOS 15 上有个按钮点不动,Android 12 上表单提交后页面卡死。本地模拟器都正常,真机又没那么多型号。折腾半天,想起之前注册过 Sauce Labs...
先别管原理,直接跑起来再说 我第一次用 Rollup 的时候,根本没搞懂什么 Tree Shaking、ESM、CJS,就是项目里有个小工具库要打包,Webpack 太重了,同事说“试试 Rollup...
又踩坑了,Loading 状态闪一下就没了 前几天改一个老项目,用户反馈说点“加载更多”按钮的时候,Loading 动画几乎看不到,一闪就没了。我一开始以为是网络太快,结果本地 mock 数据也这样—...
先看效果,再看代码 上周重构一个老项目,用户反馈说“在低端机上点按钮没反应”。我一开始以为是 JS 报错,结果打开 DevTools 一看,根本没加载 JS 文件——因为网络太差,JS 资源超时了。这...
先上代码:主题切换到底怎么搞 别扯什么 CSS 变量原理了,我直接给你一套亲测能跑通的方案。这玩意儿我在三个项目里用过,包括一个后台管理系统和两个对外站点,基本没翻车。 核心思路就一个:用 CSS 自...
为啥要折腾敏感信息的前端处理? 最近在做几个移动端项目,用户登录、支付、个人资料这些功能都涉及敏感信息。说实话,一开始我也没太在意,觉得“不就是把手机号、身份证号显示出来嘛”,直到有一次测试说“你这页...
为什么我又要折腾 Commit 规范? 说实话,我一开始对 Commit 规范是无感的。自己写代码,自己看,随便写个“fix bug”不也挺好?但自从项目上了 CI/CD、开始自动生成 CHANGEL...
项目初期为啥选了自定义事件 去年接了个后台管理系统重构的活儿,页面里有十多个模块要联动。比如用户在筛选器里改个条件,表格得刷新,图表也得跟着变,右侧面板还得更新统计数字。一开始想用 Vuex 或者 R...
先上手,再问为什么 我之前做项目,经常被设计师追着问:图标怎么又糊了?为什么加载那么慢?能不能统一管理?一开始我也用最原始的办法——直接扔 SVG 文件到 assets 里,用 img 标签引用。结果...
优化前:卡得不行 上周上线一个移动端商品列表页,用户反馈“一滑就卡”“手指动了页面半天不动”。我本地测试也确实离谱——低端机上滑动直接掉到10帧以下,高端机勉强能看但也不流畅。查了下代码,发现每次 t...
Hi~欢迎来到 JZTHEME 即刻开启你的创意之旅