前端技术文章

  • MutationObserver使用教程:监控属性与子节点变化
    MutationObserver使用教程:监控属性与子节点变化
    MutationObserver回调不触发最常见原因是配置漏项或目标节点失效:需显式调用observe()且target必须真实存在;监听class/style需用setAttribute而非property赋值;childList监听需注意subtree和removedNodes处理;attributeFilter与attributeOldValue须配合使用以避免性能问题。
    文章 · 前端   |  1个月前  |   490浏览 收藏
  • HTML模态框常见布局与交互实现
    HTML模态框常见布局与交互实现
    dialog默认不显示,需显式调用showModal()才呈现;必须已挂载DOM、重置样式、处理无障碍,且Firefox不支持::backdrop。
    文章 · 前端   |  1个月前  |   355浏览 收藏
  • 柯里化转换API:多参数变单参数链式调用
    柯里化转换API:多参数变单参数链式调用
    柯里化是让函数分步接收参数并返回新函数,直至参数齐备才执行,不改变原始逻辑而适配函数式编程;需按语义分层固化参数、用通用curry工具指定arity、结合闭包预置上下文,并自然融入pipe/compose数据流。
    文章 · 前端   |  1个月前  |   205浏览 收藏
  • OffscreenCanvas 实现 TB 级实时渲染方案
    OffscreenCanvas 实现 TB 级实时渲染方案
    OffscreenCanvas仅提供Worker中的渲染上下文,不解决TB级数据瓶颈;需手动实现分片传输、流式顶点更新、GPU缓冲复用及ImageBitmap零拷贝输出。
    文章 · 前端   |  1个月前  |   170浏览 收藏
  • 鼠标悬停图片放大不溢出,CSS transform与overflow控制
    鼠标悬停图片放大不溢出,CSS transform与overflow控制
    图片放大溢出的根本原因是transform:scale()仅改变视觉渲染而不影响文档流,必须同时设置overflow:hidden、display:block和transform-origin三者缺一不可。
    文章 · 前端   |  1个月前  |   354浏览 收藏
  • CSS中实现丝滑颜色阶梯的OKLab插值方法
    CSS中实现丝滑颜色阶梯的OKLab插值方法
    CSS原生不支持oklab颜色空间插值,transition无法在oklab中计算中间色;必须通过JavaScript手动计算oklab色阶并转为rgb/hsl,再用CSS变量和transition驱动才能实现真丝滑阶梯。
    文章 · 前端   |  1个月前  |   466浏览 收藏
  • CSS多层嵌套难调试?用border和outline快速定位边界
    CSS多层嵌套难调试?用border和outline快速定位边界
    用border和outline临时加边框是盒模型嵌套调试最快捷方式:border标content/padding区,outline标margin区,box-shadow可模拟单边描边,分层标记后立即删除。
    文章 · 前端   |  1个月前  |   243浏览 收藏
  • WeakRef 实现可主动释放的组件 Ref 容器
    WeakRef 实现可主动释放的组件 Ref 容器
    WeakRef不能替代ref/reactive,因其无.value属性、不触发getter/setter、不参与Vue/React依赖追踪,仅作弱引用防内存泄漏;需配合ref使用。
    文章 · 前端   |  1个月前  |   123浏览 收藏
  • HTML Shadow DOM事件冒泡机制解析
    HTML Shadow DOM事件冒泡机制解析
    ShadowDOM事件默认不穿透边界,外部监听器的event.target被重定向为宿主元素;需用event.composedPath()[0]获取真实目标,或派发bubbles:true且composed:true的自定义事件实现跨边界通信。
    文章 · 前端   |  1个月前  |   494浏览 收藏
  • 全量 Diff 与局部 Patch 区别解析
    全量 Diff 与局部 Patch 区别解析
    Vue的Diff是策略性增量比对,非全量O(n²)比对;Patch是diff结果的自然执行,仅作用于判定变更的节点及必要子树,通过双端剪枝、key映射、v-memo实现三层收敛优化。
    文章 · 前端   |  1个月前  |   427浏览 收藏
  • Svelte中使用:global()控制全局样式作用域
    Svelte中使用:global()控制全局样式作用域
    Svelte组件默认样式局部化是通过编译时为CSS添加唯一属性选择器(如svelte-123abc)实现,而非ShadowDOM;:global()仅放行括号内选择器,需避免嵌套与误用,全局样式应统一管理于app.css而非组件内style块。
    文章 · 前端   |  1个月前  |   169浏览 收藏
  • HTML模板缓存清理技巧与性能优化要点
    HTML模板缓存清理技巧与性能优化要点
    HTML模板更新后页面仍显示旧内容,根本原因是多层缓存未彻底清理:ServiceWorker、CacheStorage、CDN及HTTP强缓存均可能拦截请求;仅Ctrl+F5无效,须按浏览器级→站点级→服务端级顺序清除,并配合URL版本化或构建哈希确保资源更新。
    文章 · 前端   |  1个月前  |   351浏览 收藏
  • JavaScript代码风格统一:eslint与prettier配置教程
    JavaScript代码风格统一:eslint与prettier配置教程
    ESLint与Prettier分工协作:ESLint检查逻辑错误,Prettier专注格式化;必须安装eslint-config-prettier以禁用ESLint中与其冲突的格式规则,且需置于extends末尾,否则会导致fix结果不可预测。
    文章 · 前端   |  1个月前  |   260浏览 收藏
  • CSS优化如何提升LCP性能指标
    CSS优化如何提升LCP性能指标
    影响LCP的CSS规则包括:阻塞渲染的未内联/大体积CSS、@import串行加载、display:none元素的冗余样式解析;需内联关键样式、避免font-display非swap值、用width/height+aspect-ratio占位防抖动、慎用transform/vw等运行时计算属性。
    文章 · 前端   |  1个月前  |   243浏览 收藏
  • HTML5播放如何切换Flash,Edge新版找不到Flash选项怎么解决
    HTML5播放如何切换Flash,Edge新版找不到Flash选项怎么解决
    Edge新版(Chromium内核90+)彻底移除Flash,因微软2021年1月停用且Chromium88+禁用NPAPI,设置页404、插件列表无项、注册表废弃;网站需升级HTML5或临时用IE模式。
    文章 · 前端   |  1个月前  |   240浏览 收藏
查看更多
课程推荐
  • 前端进阶之JavaScript设计模式
    前端进阶之JavaScript设计模式
    设计模式是开发人员在软件开发过程中面临一般问题时的解决方案,代表了最佳的实践。本课程的主打内容包括JS常见设计模式以及具体应用场景,打造一站式知识长龙服务,适合有JS基础的同学学习。
    543次学习
  • GO语言核心编程课程
    GO语言核心编程课程
    本课程采用真实案例,全面具体可落地,从理论到实践,一步一步将GO核心编程技术、编程思想、底层实现融会贯通,使学习者贴近时代脉搏,做IT互联网时代的弄潮儿。
    516次学习
  • 简单聊聊mysql8与网络通信
    简单聊聊mysql8与网络通信
    如有问题加微信:Le-studyg;在课程中,我们将首先介绍MySQL8的新特性,包括性能优化、安全增强、新数据类型等,帮助学生快速熟悉MySQL8的最新功能。接着,我们将深入解析MySQL的网络通信机制,包括协议、连接管理、数据传输等,让
    500次学习
  • JavaScript正则表达式基础与实战
    JavaScript正则表达式基础与实战
    在任何一门编程语言中,正则表达式,都是一项重要的知识,它提供了高效的字符串匹配与捕获机制,可以极大的简化程序设计。
    487次学习
  • 从零制作响应式网站—Grid布局
    从零制作响应式网站—Grid布局
    本系列教程将展示从零制作一个假想的网络科技公司官网,分为导航,轮播,关于我们,成功案例,服务流程,团队介绍,数据部分,公司动态,底部信息等内容区块。网站整体采用CSSGrid布局,支持响应式,有流畅过渡和展现动画。
    485次学习
  • Golang深入理解GPM模型
    Golang深入理解GPM模型
    Golang深入理解GPM调度器模型及全场景分析,希望您看完这套视频有所收获;包括调度器的由来和分析、GMP模型简介、以及11个场景总结。
    474次学习
查看更多
AI推荐
  • ChatExcel酷表:告别Excel难题,北大团队AI助手助您轻松处理数据
    ChatExcel酷表
    ChatExcel酷表是由北京大学团队打造的Excel聊天机器人,用自然语言操控表格,简化数据处理,告别繁琐操作,提升工作效率!适用于学生、上班族及政府人员。
    8612次使用
  • Any绘本:开源免费AI绘本创作工具深度解析
    Any绘本
    探索Any绘本(anypicturebook.com/zh),一款开源免费的AI绘本创作工具,基于Google Gemini与Flux AI模型,让您轻松创作个性化绘本。适用于家庭、教育、创作等多种场景,零门槛,高自由度,技术透明,本地可控。
    9031次使用
  • 可赞AI:AI驱动办公可视化智能工具,一键高效生成文档图表脑图
    可赞AI
    可赞AI,AI驱动的办公可视化智能工具,助您轻松实现文本与可视化元素高效转化。无论是智能文档生成、多格式文本解析,还是一键生成专业图表、脑图、知识卡片,可赞AI都能让信息处理更清晰高效。覆盖数据汇报、会议纪要、内容营销等全场景,大幅提升办公效率,降低专业门槛,是您提升工作效率的得力助手。
    8856次使用
  • 星月写作:AI网文创作神器,助力爆款小说速成
    星月写作
    星月写作是国内首款聚焦中文网络小说创作的AI辅助工具,解决网文作者从构思到变现的全流程痛点。AI扫榜、专属模板、全链路适配,助力新人快速上手,资深作者效率倍增。
    10758次使用
  • MagicLight.ai:叙事驱动AI动画视频创作平台 | 高效生成专业级故事动画
    MagicLight
    MagicLight.ai是全球首款叙事驱动型AI动画视频创作平台,专注于解决从故事想法到完整动画的全流程痛点。它通过自研AI模型,保障角色、风格、场景高度一致性,让零动画经验者也能高效产出专业级叙事内容。广泛适用于独立创作者、动画工作室、教育机构及企业营销,助您轻松实现创意落地与商业化。
    9697次使用
微信登录更方便
  • 密码登录
  • 注册账号
登录即同意 用户协议隐私政策
返回登录
  • 重置密码