前端知识

一、HTML/CSS核心

  1. 盒模型与布局

    • 标准盒模型(content-box)与怪异盒模型(border-box)的区别及box-sizing的作用

    • Flex布局实现三栏等高布局(flex-grow分配剩余空间)

    • Grid布局的fr单位与隐式轨道定义

  2. CSS高级特性

    • BFC触发条件:浮动、绝对定位、overflow非visible等,用于解决外边距合并问题

    • 伪类(:hover)与伪元素(::before)的区别:伪类描述状态,伪元素创建虚拟元素

    • CSS动画优化:优先使用transformopacity触发GPU加速


二、JavaScript深度

  1. ES6+特性

    • let/const的块级作用域与暂时性死区(TDZ)现象

    • 可选链(?.)与空值合并运算符(??)的短路特性

    • Promise.allSettledPromise.any的区别:前者等待所有完成,后者首个成功即返回

  2. 核心机制

    • 闭包的内存泄漏场景:未清理的DOM引用或定时器

    • 事件循环中微任务(Promise.then)优先于宏任务(setTimeout)执行

    • 手写深拷贝函数需处理循环引用(使用WeakMap缓存)


三、框架专项(React/Vue)

  1. React 19

    • Server Components原理:服务端渲染零客户端Bundl

    • useTransition优化交互:标记非紧急更新(如搜索输入防抖)

    • Fiber架构的可中断渲染:链表结构+优先级调度

  2. Vue 4.0

    • Composition API逻辑复用优势:解耦功能代码,替代Mixin

    • Teleport组件实现模态框跨DOM层级渲染

    • 响应式原理:Proxy拦截 vs Vue2的Object.defineProperty


四、工程化与优化

  1. 构建工具

    • Vite的ESM按需编译:开发环境无需打包

    • Webpack Tree Shaking条件:ES Module静态分析+SideEffects标记

  2. 性能优化

    • 岛屿架构(Astro):仅激活交互区域的Partial Hydration

    • CDN动态加速:边缘节点缓存API响应

    • 首屏优化:SSR+CSR混合渲染+流式HTML


五、2025新兴考点

  1. WebGPU

    • 3D渲染性能对比WebGL提升5倍+,支持计算着色器

  2. AI集成

    • GitHub Copilot生成代码片段,需人工校验安全性

  3. 微前端

    • qiankun2.0的样式隔离方案:Shadow DOM+CSS命名空间


标签:

相关文章

个人学习计划

学习计划是一个帮助你提高学习效率和使用时间的有效工具。以下是一个可能的学习计划:目标设定。 在开始学习之前,明确你的学习目标和目的地,这有助于你制定实际可行的计划。分解任务。 将大...

沟通的模型

7C模型:这是一种在商业沟通中常见的模型,旨在确保信息在传递过程中清晰、简明、准确、一致、可信、可理解和有说服力。沟通的五个W和一个H:何人(Who)何事(What)何地(Where)何时(When)...

前端-网络问题

1. 什么是HTTP?它是如何工作的?答案:HTTP(Hypertext Transfer Protocol)是一种用于在Web上传输数据的协议。它使用客户端-服务器模型,客户端发送HTTP请求到服务...

产品经理的主要职责是什么

产品经理的主要职责可以概括为以下几个核心方面,这些职责共同确保产品从概念到市场的成功:一、‌产品规划与战略制定‌‌市场调研与需求分析‌研究行业趋势、竞争对手动态及用户行为,挖掘潜在需求。通过用户访谈、...

JavaScript(ECMAScript)新特性

一、异步处理优化‌Promise.withResolvers‌支持直接创建包含resolve和reject控制的Promise对象,简化异步流程管理,适用于延迟加载、事件流控制等场景const&nbs...

在VS Code中配置和使用UniApp开发的完整指南

UniApp是一个基于Vue.js的跨平台应用开发框架,而VS Code是许多开发者首选的轻量级代码编辑器。本文将详细介绍如何在VS Code中配置UniApp开发环境、创建项目、调试以及解决常见问题...