前端技术文章
-
- 模块热重载状态保持原理解析
- HMR通过模块热替换与框架协作保留应用状态。当代码修改时，Webpack等工具触发更新，ReactFastRefresh或VueHMR会尝试用新代码替换旧模块而不卸载组件实例，从而保留useState、data等局部状态，并重新渲染视图。该机制依赖模块接受更新、内存中代码替换及框架层协调，如React保留函数组件状态、Vue更新选项对象并维持响应式数据。但涉及全局状态（Redux/Vuex）、Context变更、副作用清理、key变化或高阶组件时，可能触发回退至重挂载或整页刷新，导致状态丢失。因此，HMR
- 文章 · 前端 | 2个月前 | 469浏览 收藏
-
- CSS使用PurgeCSS精简生产环境样式，大幅减小文件体积
- PurgeCSS不删除动态生成的class，只识别源码中静态出现的class字符串；需通过safelist、whitelistPatterns或defaultExtractor处理动态情况，并确保其在CSS压缩前执行。
- 文章 · 前端 | 2个月前 | 469浏览 收藏
-
- Next.js App Router 服务端获取用户信息方法
- 在Next.jsAppRouter中无法直接从服务端访问localStorage，需改用HTTP-onlyCookie存储令牌，并通过服务端fetch调用/api/auth/me完成身份验证与用户数据预取。
- 文章 · 前端 | 2个月前 | 469浏览 收藏
-
- CSS嵌套浮动元素怎么处理？
- 解决父元素高度塌陷的关键是清除浮动，常用方法包括伪元素clearfix、overflow:hidden、display:flow-root等，推荐使用display:flow-root或::after伪元素清除法，确保父容器正确包裹浮动子元素，避免布局错位。
- 文章 · 前端 | 2个月前 | 469浏览 收藏
-
- CSS精准定位背景图位置技巧
- background-position以背景图片左上角为锚点，相对于容器内容区左上角定位；px值表示图片左上角的偏移量，百分比值按“图片对应比例位置对齐容器对应比例位置”计算，顺序必须水平在前垂直在后。
- 文章 · 前端 | 2个月前 | 469浏览 收藏
-
- CSS复古色调：sepia滤镜实现褐色效果
- sepia()滤镜不是纯褐色，因其按标准算法将RGB转单色再叠褐色调，保留明暗但压缩色相，导致偏灰发闷；需配合brightness()、contrast()及噪点蒙版等才能模拟真实胶片效果。
- 文章 · 前端 | 2个月前 | 469浏览 收藏
-
- HTML倒计时如何精准控制时间？
- HTML倒计时精度不依赖定时器而依赖时间戳差值计算；必须用服务端返回的可信时间戳与Date.now()实时差值来计算剩余时间，UI更新可用requestAnimationFrame或动态setTimeout，但核心逻辑不可累加或依赖setInterval。
- 文章 · 前端 | 2个月前 | 469浏览 收藏
-
- HTML布局方法与技巧全解析
- Flex适合单向顺序布局（如header+main+sidebar+footer），Grid适合二维坐标布局；关键在父容器设display:flex/grid，子元素用对应属性控制，避免误用绝对定位或表格做主结构。
- 文章 · 前端 | 2个月前 | 469浏览 收藏
-
- Flexbox水平垂直居中技巧
- 使用justify-content和align-items可实现居中。设置display:flex的容器通过justify-content:center实现水平居中，align-items:center实现垂直居中，需确保容器有高度（如height:100vh），支持单个或多子元素整体居中，方法简洁兼容现代浏览器。
- 文章 · 前端 | 2个月前 | 469浏览 收藏
-
- HTML5列表序号怎么设置？
- 可通过HTML5的<ol>标签或CSScounter属性为列表添加自定义序号：<ol>支持start、type、reversed等属性控制编号；CSScounter通过counter-reset、counter-increment和counter()函数实现灵活计数；二者可混合使用以统一风格；嵌套列表需分层定义计数器；常见异常需检查初始化、作用域及伪元素渲染。
- 文章 · 前端 | 2个月前 | 469浏览 收藏
-
- CSS过渡实现元素渐变效果教程
- transition可实现CSS样式平滑过渡，通过property、duration、timing-function和delay四个子属性控制动画效果，常用于鼠标悬停等交互场景。
- 文章 · 前端 | 2个月前 | 469浏览 收藏
-
- HTML滚动优化技巧，提升页面性能必看
- 滚动卡顿主因是触发重排、强制同步布局或图层爆炸；须用passive:true、transform替代top/margin、节流布局读取、提升图层、长列表必用虚拟滚动。
- 文章 · 前端 | 1个月前 | 469浏览 收藏
-
- CSS字体样式控制实用技巧分享
- 合理使用CSS字体属性可提升网页可读性与美观度。首先设置font-family，提供首选字体及通用备选，如"HelveticaNeue",Arial,sans-serif；其次通过font-size选择合适单位（推荐rem或em）控制字号；再用font-weight（如bold、700）和font-style（如italic）调整字重与倾斜；最后可用font简写属性合并设置，语法为font:[style][weight]size[/line-height]family，如font:italicbold16
- 文章 · 前端 | 1个月前 | 469浏览 收藏
-
- HTML5适配Tecno手机教程
- Tecno手机无HTML5私有API，适配关键是解决其老旧Android系统WebView兼容性问题；需检测UA确认内核版本，强制viewport完整声明，降级新CSS/JS特性，并用多真机交叉验证。
- 文章 · 前端 | 1个月前 | 469浏览 收藏
-
- HTML弹窗实现方法及代码教程
- 最快弹窗用window.alert()，但仅限调试；正式环境推荐dialog元素（Chrome97+/Firefox99+/Safari15.4+）或手写modal；需处理焦点管理、ESC关闭、遮罩层交互及移动端适配。
- 文章 · 前端 | 1个月前 | 469浏览 收藏
查看更多
课程推荐
-
- 前端进阶之JavaScript设计模式
- 设计模式是开发人员在软件开发过程中面临一般问题时的解决方案，代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景，打造一站式知识长龙服务，适合有JS基础的同学学习。
- 543次学习
-
- GO语言核心编程课程
- 本课程采用真实案例，全面具体可落地，从理论到实践，一步一步将GO核心编程技术、编程思想、底层实现融会贯通，使学习者贴近时代脉搏，做IT互联网时代的弄潮儿。
- 516次学习
-
- 简单聊聊mysql8与网络通信
- 如有问题加微信：Le-studyg；在课程中，我们将首先介绍MySQL8的新特性，包括性能优化、安全增强、新数据类型等，帮助学生快速熟悉MySQL8的最新功能。接着，我们将深入解析MySQL的网络通信机制，包括协议、连接管理、数据传输等，让
- 500次学习
-
- JavaScript正则表达式基础与实战
- 在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
- 487次学习
-
- 从零制作响应式网站—Grid布局
- 本系列教程将展示从零制作一个假想的网络科技公司官网，分为导航，轮播，关于我们，成功案例，服务流程，团队介绍，数据部分，公司动态，底部信息等内容区块。网站整体采用CSSGrid布局，支持响应式，有流畅过渡和展现动画。
- 485次学习
-
- Golang深入理解GPM模型
- Golang深入理解GPM调度器模型及全场景分析，希望您看完这套视频有所收获；包括调度器的由来和分析、GMP模型简介、以及11个场景总结。
- 474次学习
查看更多
AI推荐
-
- ljg-skills
- ljg-skills 是李继刚开源的 AI 技能与提示词集合，面向大模型使用者整理了一批可复用的 prompt、角色设定和任务技能模板，适合用于学习提示词设计、搭建个人 AI 工作流和沉淀团队常用智能体能力。
- 169次使用
-
- MELO音乐
- MELO音乐是一站式AI视频与音乐制作助手，对标suno, udio的高品质体验。提供伴奏生成、原创写词、无损导出、哼唱识曲、混音变声等全套音频与短视频编辑工具。无论是流行Kpop、电音说唱、民谣古风、摇滚儿歌还是商用轻音乐，MELO为你免费谱曲，轻松做同款！
- 185次使用
-
- UniScribe
- UniScribe 是一款 AI 音视频转文字与内容整理工具，支持上传音频、视频文件或粘贴 YouTube 链接，自动生成转写文本、摘要、思维导图和关键问题，并支持多格式导出，适合会议记录、课程学习、访谈整理和内容创作复盘。
- 168次使用
-
- 剧云
- 剧云是专业中文剧本创作平台，安全稳定运行十余年，集成AI编剧、剧本医生审核、人物小传、剧情关系图、大纲编写、多人协作、Word导入导出、版权管控功能，数据安全防护，轻松高效创作剧本。
- 324次使用
-
- 万象有声
- 万象有声，一个专为有声创作者打造的新一代智能有声内容创作平台。平台提供专业的智能拆章、智能画本编辑、AI配音、AI生成音效、后期制作、智能对轨、智能审听等有声创作全流程工具，可以帮助创作者高效、低成本创作出引人入胜的有声作品。立即体验，让有声书制作更简单！
- 323次使用
