wcc_2006的博客

1.多多面试：锻炼在被审视的情况下回答更有逻辑化点。2.引导面试官:不要假设面试官了解你的项目，大部分面试官几乎都不太了解你的项目，甚至就算了解可能具体的技术点他也没有涉及到过。他会根据你的描述来去发问，抓住一个点进行深挖，无论这个东西涉及到什么（算法，计算操作系统，计算机组成原理）。所以你讲述的时候就要有引导性，引导他们往你会的熟悉的方向思考发问。3.自我介绍：介绍的时候项目不用过于详细，如果面试官想了解的话他会抓住他感兴的点继续进行问的。4.项目。

浏览器的主线程负责解析 HTML、CSS，执行 JavaScript，以及处理用户交互。当一个 JavaScript 任务执行时间超过 50毫秒时，就会被定义为长任务 (Long Task)。长任务会导致浏览器无法及时响应用户操作，造成掉帧或卡顿（即影响 INP 指标）。Tree Shaking（摇树优化）指的是在构建打包时，只保留实际执行到的代码，消除无用（Dead Code）代码，以减小最终打包体积。

回答回流：当 DOM 元素的几何属性（宽高、边距、位置等）发生变化，浏览器需要重新计算布局并渲染部分或全部页面。重绘：元素外观样式（颜色、背景、可见性）改变但几何尺寸不变时，重新绘制的过程。减少方法使用 CSStransform代替topleft做动画（transform 跳过回流，只触发合成）读写 DOM 分离（使用批量修改样式，例如添加class而不是逐个改属性将元素设为后修改再显示（脱离文档树）回答BFC（块级格式化上下文）是页面中一块独立的渲染区域，内部子元素不会影响外部元素。

WebRTC（Web Real-Time Communication）是 Google 开源的一项实时通信技术，直接内置于浏览器，无需安装任何插件或第三方软件，就能实现浏览器之间的音视频通话、数据传输和屏幕共享。核心指标：端到端延迟可控制在200ms 以内，相比传统基于服务器的轮询方案延迟降低90%，且服务器带宽成本可减少70%以上（因为媒体流不经过服务器中转）。

简单来说，你可以使用C，C++,Rust,Go等语言编写代码，然后编译为WebAssembly，在浏览器中运行。打开编译系统环境变量窗口，点击环境变量最后一直点击每个未关闭窗口的确认即可。使用cmd打开需要被编译的C++文件夹，输入命令行emsdk activate（这仅仅会激活当前的环境，下次换另一个文件夹还需要再次激活），输入命令行emcc -v来检测配置是否成功，配置成功即可进入文件中书写代码。代码编写完成后进入cmd窗口，输入命令行emcc 文件名，编译器就会对该文件进行编译.当我们查看文件夹时，会

在上一篇文章中，我们实现了基础的响应式系统：通过Proxy拦截对象的读写操作，在get时自动收集依赖（track），在set时自动派发更新（trigger），完成了数据驱动视图的闭环。effect是一个全局硬编码的变量，无法处理多个副作用函数共存的场景；每次数据变动都会立即执行更新，无法做到批量调度；也不支持computed和watch这些 Vue 中最常用的响应式 API。本文将逐一解决这些问题。从最简单的Set收集依赖，到三层结构精确追踪，再到Proxy实现自动化，最后演进到scheduler。

Vue 实现响应式的原理中有两个最重要的步骤：依赖收集和派发更新。接下来我们将围绕这两点进行完善和优化，以实现响应式功能。

web worker为web内容在后台线程运行脚本提供了一种简单的方法。线程可以执行任务而不干扰用户界面。涉及到大量数据极端，解析或者生成大文件的时候，就可以在web worker这个线程中进行，丝毫不影响主线程的页面渲染，用户体验感堪称丝滑。

双指针思想：一个数组，设定左右指针，left 和 right，左指针指向数组第一项，右指针指向数组最后一项。相加得出一个和sum，与target值相比较。根据比较的结果，对left和right进行移动。但需注意的是，使用双指针，数组得是有序的，如果数组无序，需要先是使用Arrays.sort()进行排序。

数据在发送端从应用层逐层向下封装（添加头部），接收端从物理层逐层向上解包（剥去头部），最终还原数据供应用程序处理。

阅后即焚：在前端内存里完成解压的几十毫秒内，纯净的数据立刻被喂给 MSE 的缓冲区，整个明文传输链路甚至没有出现过在 Network 抓包面板里，极大地拉高了防盗版的技术门槛。在传统的网页开发中，前端处理视频的方式非常被动：给 video标签指定一个src，剩下的下载、缓冲、解码工作完全由浏览器底层“黑盒”接管，开发者几乎无法干预。拆解解包 ：在前端 JS 内存中，将 FLV 这层“包装盒”拆掉，提取出里面的纯视频数据 (H.264) 和纯音频数据 (AAC)。利用 MSE，网络请求变成了前端代码可控的。

用户看到的内容是 出现在窗口中的渲染视区层 而占位层提供的占位器会导致整个窗口向下移动，而渲染视区层和占位层都使用的是绝对定位，top：0。当窗口下移的时候，渲染视区层不会跟着下移，用户此时看到的是空白内容，因为我们只渲染了需要的DOM节点，并未将所有DOM节点渲染，当窗口下移时，渲染视区层的没有DOM啊，这就是一片空白。可以将整个过程看作“在望远镜中看天空”，望远镜就是窗口，天空就是渲染视区层，而占位层形成的滚动条是让望远镜上下移动的转轴。先实现最基础的虚拟列表，滚动层占位层视页层。

分片上传的核心思想是将“大文件”分割成多个“小文件块”（Chunk），逐个或并发上传至服务器。服务器接收到所有分片后，将其合并还原为原始文件。大文件分片上传是前端开发中处理大体积文件（如视频、大压缩包）上传的标准解决方案。准确且高效地计算文件 MD5 是实现秒传的基础。该部分涵盖了切片循环、分片校验（Check）、构建表单（FormData）及请求发送。以下是结合了 UI 交互、上传进度反馈、日志记录及异常处理的 Vue3 组件完整实现。等显著优势，能够极大提升上传的稳定性和用户体验。

稳定性：一个 Tab 崩了，不会导致整个浏览器崩。安全性：渲染进程运行在沙箱中，限制了读写系统文件的权限。流畅性：JS 阻塞渲染进程时，不会影响 Browser 进程的 UI 响应（如切换 Tab）。Reflow (重排)：修改了几何属性（宽/高）。触发。最贵。Repaint (重绘)：修改了颜色/背景。触发。次之。Composite (合成)：修改transform或opacity。只触发 Composite。原理：不占用主线程，直接在合成线程操作图块。即使 JS 卡死，动画依然流畅。

将表单接口抽离到单独的类型文件中，可以在组件、Store 和 API 层之间共享，避免重复定义。newPassword: string // 确认密码// ...组件拆分是前端工程化中的重要一环。不要等到组件变得不可维护时才想到重构。在开发初期，保持良好的组件设计思维，遵循单一职责原则（SRP），能让我们的代码库保持长久的生命力。

本质：用 JS 的计算量（算位置）换取 DOM 的渲染量（少节点）。适用：长列表、无限滚动、聊天记录、大量数据表格。忙碌：由于接口接踵而至，但是数据确实前提没有协商过的，所以组件一直在变更，同时逻辑也不是很好写，所以这一周实在没学什么新东西，一直在改改改修修修，不过这周计划将虚拟列表正式学习一下，项目中会用到。开心：团建吃了好吃的，看了疯狂动物城全程无槽点都给我去看。

在开发后台管理系统时，登录和注册是最基础的功能。很多新手容易陷入“写一堆if-else判断输入框是否为空”的泥潭中。利用用户体验友好：实时提示错误（如格式不对）。代码整洁：告别冗余的逻辑判断。数据安全：在发送请求前拦截非法数据。确认密码必须等于密码），我们需要编写validator函数。场景演示：校验“确认密码”// 1. 定义校验函数callback(new Error('请再次输入密码'))// 核心逻辑：对比两次输入callback(new Error('两次输入密码不一致!'))

首先，拆解页面的时候，观察相似结构的组件，区分它们之间的共同特性和差别，共同特性我们可以使用公共类来实现样式效果，而对于差别，要进行分类，如果是所展示数据不同，那么可以使用props接收数据并进行展示；如果是所展示的内部样式不同，那么可以使用动态样式。Vue官方文档，绑定HTML class章节中第一小节绑定对象中写到我们可以给:class//借鉴该示例。

阅读Vue官方文档中所记录的笔记

我们可以使用let来定义变量i，let定义的变量是有块级作用域的，意味着，for循环每循环一次就会，就会为i创建一个单独的块级作用域，而setTimeou中产生的闭包会捕获并记住其所在作用域的变量，setTimeout中捕获到了不同的i值进行打印，而打印出来的自然是1 2 3 4 5 6.这里没有严格按照定义的原因是，通俗来讲，函数作为闭包的载体，是可以看得见，调用的着的东西，词法环境是较为抽象的，所以一般我们会通俗的称这个函数为闭包。闭包里的函数就相当这个宇航员，我们一看到它就知道，哦，有闭包产生了。