前端技术文章

  • 微任务影响性能,不阻塞渲染
    微任务影响性能,不阻塞渲染
    微任务不会直接阻塞渲染,但会延迟渲染时机。因为微任务在当前宏任务执行后、渲染前执行,若微任务队列过长或执行复杂计算,将占用主线程,推迟浏览器更新屏幕的机会,导致页面卡顿。事件循环中,主线程执行完同步代码后优先处理所有微任务,之后才进行渲染和执行下一个宏任务。若微任务链过长,会持续推迟渲染,造成视觉上的不流畅。优化方式包括:1.拆分任务,使用setTimeout或requestAnimationFrame分批执行;2.合理使用Promise,避免嵌套与同步计算;3.将耗时任务移至WebWorkers中执行,
    文章 · 前端   |  5个月前  |   401浏览 收藏
  • HTML树形结构与层级展示如何完美结合
    HTML树形结构与层级展示如何完美结合
    HTML树形结构与层级展示不冲突,但“树形”需靠DOM层级+CSS+JS协同实现;常见问题包括状态不同步、样式覆盖、SSRhydration失败及details/summary无法联动控制等。
    文章 · 前端   |  5个月前  |   150浏览 收藏
  • CSSGrid布局简单注册表单设计
    CSSGrid布局简单注册表单设计
    CSSGrid注册页布局需语义化HTML、两列式网格对齐标签与输入框,并用display:contents使子元素直参网格排列,小屏时通过媒体查询转单列。
    文章 · 前端   |  5个月前  |   281浏览 收藏
  • 滚动条自动定位到底部的实现方法
    滚动条自动定位到底部的实现方法
    通过JavaScript动态将scrollHeight设置为滚动位置,配合flex-direction:column布局,可确保消息容器内容新增时滚动条始终自动锚定至底部,实现类WhatsApp/微信的即时聊天体验。
    文章 · 前端   |  5个月前  |   366浏览 收藏
  • JavaScript实现无限滚动列表技巧
    JavaScript实现无限滚动列表技巧
    答案:无限滚动通过IntersectionObserver实现高效加载,提升用户体验但影响SEO和性能。需结合分页备用、URL状态更新及预渲染等策略优化。
    文章 · 前端   |  5个月前  |   189浏览 收藏
  • 动态修正底部遮挡,window.innerHeight应用技巧
    动态修正底部遮挡,window.innerHeight应用技巧
    移动端window.innerHeight忽大忽小是因Safari和Chrome(iOS)地址栏收起/展开时动态调整所致;应优先使用visualViewport.height并监听visualviewport.resize事件,fallback可用screen.height结合方向与经验偏移估算。
    文章 · 前端   |  5个月前  |   356浏览 收藏
  • WordPress正确引入CSS方法详解
    WordPress正确引入CSS方法详解
    直接在header.php中硬编码<link>会覆盖WordPress主题更新、破坏样式依赖管理、导致加载顺序错乱;必须用wp_enqueue_style在wp_enqueue_scripts钩子中注册,确保依赖、缓存、路径和handle正确。
    文章 · 前端   |  5个月前  |   323浏览 收藏
  • Set去重原理与引用类型处理详解
    Set去重原理与引用类型处理详解
    Set通过Same-value-zero机制实现去重,支持原始值和引用类型唯一性判断,其中NaN被视为相同,引用类型基于地址比较,内容相同但地址不同仍视为不同值,因此需借助JSON.stringify或深比较实现内容去重。
    文章 · 前端   |  5个月前  |   439浏览 收藏
  • JavaScript虚拟滚动实现技巧详解
    JavaScript虚拟滚动实现技巧详解
    虚拟滚动通过只渲染可视区和缓冲区元素来提升长列表性能,利用占位器维持滚动高度,滚动时动态更新元素位置与内容,核心是计算可视区域的起始索引并复用DOM,结合requestAnimationFrame优化渲染。
    文章 · 前端   |  5个月前  |   282浏览 收藏
  • 异步定时器实现精准倒计时方法
    异步定时器实现精准倒计时方法
    高性能异步倒计时需用loop.time()+call_at()替代sleep实现绝对时间锚定,每次回调动态补偿调度延迟,并封装为可暂停、取消、查询剩余时间的类。
    文章 · 前端   |  5个月前  |   425浏览 收藏
  • text-orientation竖排文字方向控制方法
    text-orientation竖排文字方向控制方法
    text-orientation必须与writing-mode配合使用,仅设text-orientation无效;mixed是中英混排竖排的默认推荐值,使汉字直立、ASCII字符顺时针旋转90°,符合出版规范。
    文章 · 前端   |  5个月前  |   268浏览 收藏
  • HTML多选过滤与复选框布局技巧
    HTML多选过滤与复选框布局技巧
    用<inputtype="checkbox">实现品牌多选过滤需统一name(如brand)、为每个设置唯一value(如"apple"),包裹在<label>中保证可访问性与样式控制,JS通过FormData.getAll('brand')安全获取选中值数组。
    文章 · 前端   |  5个月前  |   118浏览 收藏
  • 自定义Bootstrap单选复选框样式教程
    自定义Bootstrap单选复选框样式教程
    自定义表单控件需通过伪元素+相邻选择器绑定状态,补全浏览器前缀、隐藏原生控件、适配暗色模式与禁用态,并确保可访问性。
    文章 · 前端   |  5个月前  |   266浏览 收藏
  • VueVNode跨端架构设计详解
    VueVNode跨端架构设计详解
    VNode是平台无关的轻量级JavaScript对象,仅描述节点类型、属性、子节点等语义信息;Vue通过可插拔的渲染器将同一VNode树适配到Web、小程序、Native等不同平台,实现跨端复用。
    文章 · 前端   |  5个月前  |   390浏览 收藏
  • CSSonly-child用法与样式优化技巧
    CSSonly-child用法与样式优化技巧
    :only-child匹配父容器中唯一子元素,不区分类型且对空白节点敏感;:only-of-type仅统计同类型元素,容错性更高。选择依据是响应“数量”还是“类型”。
    文章 · 前端   |  5个月前  |   341浏览 收藏
查看更多
课程推荐
  • 前端进阶之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推荐
  • PubMedQA数据集详解:生物医学问答基准、功能与应用指南
    PubMedQA
    深入了解PubMedQA生物医学问答数据集,涵盖其核心功能、使用方法及在临床决策、药物研发等场景的应用,助力提升NLP模型性能。
    404次使用
  • H2O EvalGPT:开源LLM大模型评估与排行榜工具
    H2O EvalGPT
    H2O EvalGPT是H2O.ai推出的开源LLM评估平台,提供详细的大模型性能排行榜、行业特定基准测试及A/B测试功能,助您快速选择最适合项目的高性能大语言模型。
    481次使用
  • LMArena是什么?伯克利AI模型评估平台使用指南与功能解析
    LMArena
    LMArena是加州大学伯克利分校推出的AI模型匿名评测平台。通过盲测投票机制,用户可对比不同大模型回答并生成实时排行榜,助力开发者优化模型及用户选择最佳AI工具。
    492次使用
  • 斯坦福HELM:大语言模型Holistic Evaluation整体评估框架详解
    HELM
    深入了解斯坦福推出的HELM(Holistic Evaluation of Language Models)大模型评测体系。本文解析其核心功能、安装配置步骤及应用场景,涵盖准确性、公平性、鲁棒性等多维度指标,助力开发者全面优化语言模型性能。
    436次使用
  • MMBench详解:多模态大模型基准测试、功能特点与使用指南
    MMBench
    MMBench是由上海人工智能实验室等机构联合推出的多模态基准测试平台,提供细粒度能力评估、大规模数据集及VLMEvalKit工具。本文详细介绍其核心功能、安装使用方法及应用场景,助力开发者全面评估多模态模型性能。
    262次使用
微信登录更方便
  • 密码登录
  • 注册账号
登录即同意 用户协议 和 隐私政策
返回登录
  • 重置密码