2023年秋招那会儿前端岗的竞争烈度从投出简历的第一天就能感受到。我报名小红书前端岗之后等来的是“第一批笔试”的通知当时心里其实没底网上关于小红书面经的帖子不少但大多是零零散散的面试题回忆极少有人认真拆解笔试环节本身。现在秋招已经告一段落我把那批笔试的复盘整理成文连同我和同批考生考后交流的反馈一起写出来。这篇文章不是背题答案而是想告诉你小红书前端笔试到底在筛什么样的人哪些地方容易翻车以及准备2026届秋招时可以直接照抄的复习路径。1. 笔试基本盘题目结构决定你要在哪些能力上下注1.1 我拿到的卷子长什么样小红书的前端笔试很少出偏题怪题但覆盖面非常广而且节奏紧凑。第一批笔试整体分为三个模块基础客观题、在线编程题、场景设计题。客观题部分集中在浏览器原理、JavaScript语言机制、CSS布局、网络协议以及少量安全知识在线编程题中既有通用算法题也有需要手写前端代码的题目场景设计题通常给你一个产品需求让你写出技术方案或核心代码片段。当时我身边的同学最普遍的反应是“写不完”。这不是因为题目量有多大而是每道题都需要你写真实的代码片段或详细的思路说明而不是选完答案就完事。比如客观题里会有“以下代码输出什么”这类题目看起来是选择题实际上你必须在心里跑一遍事件循环、作用域链和类型转换光靠背八股答案是拿不准的。我整理了一下当时大家反馈的题型占比大致是这样模块常见形式占比主观感受核心考察点基础客观题单选、多选、判断40%JS、浏览器、CSS、网络、安全在线编程题一个OJ算法题 一个前端代码题40%算法思维、JS功底、编码规范场景设计题产品功能描述 开放作答20%技术选型、工程落地、交互体验这个结构说明一件事笔试不是单纯筛代码机器它还看你能不能把前端知识落到实际业务上。尤其是场景设计题小公司笔试基本不会出现小红书这类偏重产品体验的技术团队非常喜欢用这一题来拉开差距。1.2 时间分配是第一道隐形的题先说结论如果你拿到卷子就开始从头到尾按顺序做题大概率会翻车。我自己的建议是拿到卷子先花3分钟浏览全部题目按分值和你自己的把握程度排优先级而不是硬磕前面的难题。基础客观题涉及的知识点很碎容易让人陷进去。我见过有同学在一道关于CSS层叠上下文的题目上抠了十几分钟最后留给场景设计题只剩五分钟只能草草写两行思路。正确的节奏应该是客观题控制在40到50分钟内完成编程题留出50分钟场景设计题至少留出25分钟。如果某道客观题没有把握先标记不要恋战。另外在线笔试平台通常有摄像头监控和切屏限制这个大家应该都知道但我还是想提醒一句提前半小时把Chrome插件、后台自动更新全部关掉避免不必要的拦截记录。我笔试那天就碰到过一位同学因为电脑自动弹窗被后台记录了一次虽然最后成绩没受影响但她整场考试都特别紧张心态很容易崩。2. 基础考点复盘那些看似简单却答不完整的题目2.1 JavaScript机制类问题背答案和真正懂是两码事小红书笔试的JS部分出题人非常喜欢考“运行结果题”也就是给你一段代码让你选择输出顺序。这类题我建议你在备考时不要只看结论而是把每条规则都推导一遍。我考完后回忆了一下出现频率较高的知识点包括Promise、async/await、微任务与宏任务的执行顺序闭包在循环中的表现this的绑定规则类型转换和隐式转换原型链与继承比如事件循环几乎是必考。你得把“本轮宏任务执行完 - 清空微任务队列 - 进入下一轮宏任务”这个流程刻在脑子里同时要清楚Promise的then回调注册时机。曾有同学问过我“为什么async函数里await后面的代码有时看起来像同步执行”这个问题的本质是await会把后续代码包装成微任务但如果你不理解执行时机遇到嵌套的Promise就只能靠猜。还有一个高频点是深拷贝。很多人能写出JSON.parse(JSON.stringify(obj))但笔试不会这么简单它往往要求你处理循环引用、Symbol、Date、RegExp这些特殊类型并且要手写实现。我建议把深拷贝作为必练题目因为你背再多的“面试题汇总”到了考场上还是要手写。2.2 浏览器、CSS与网络信息密度最高的得分区这部分常被部分前端准备者忽略因为它不像JS八股那样天天刷屏但小红书测试得很扎实。我在笔试里遇到的CSS问题大多围绕flex与grid布局差异、BFC、层叠上下文、垂直水平居中这些基础点。技术高手有时会轻视这类题目但实际上CSS题最能看出一个人的基本功是否成体系因为零散记忆的人会写出多套堆叠的兼容性hack而真正理解CSS的人会给出简洁的方案。网络方面Cache-Control、ETag、强缓存与协商缓存的流程几乎属于送分题但送分的前提是你真的能把整个协商过程说清楚。还有一道我印象很深的题在输入URL到页面显示的完整流程中哪些环节可以优化这个问题看似考察性能优化实际上考验你对DNS、HTTP、渲染进程、脚本解析、CSSOM构建全链路的理解。只背“加CDN、合并请求、压缩静态资源”这种结论是拿不到高分的你需要能指出每个环节对应的优化手段。浏览器进程模型和渲染原理也是高频考点。当时一起笔试的朋友在复习群里讲了个很形象的类比浏览器主线程就像餐厅里既要点菜又要传菜的服务员CSS阻塞渲染相当于菜单没印出来就不能点菜JS阻塞又相当于后厨占用过道导致传菜卡住。你在做题时也用这种类比去推渲染过程会发现很好记答题时还能写得生动。比如重排和重绘的区别不能只回答“重排性能开销更大”要点出重排一定会引起重绘、反之不一定并且最好能结合display:none和visibility:hidden的例子来说明。安全方面XSS和CSRF是必背项。小红书这类社区型产品非常重视内容安全笔试里出现这类题并不意外。你要能说清楚XSS的注入点、常见绕过方式以及防御方案包括针对输入做白名单校验、输出转义、CSP设置等。CSRF则要讲明白为什么需要SameSite和校验Token。3. 在线编程环节踩分点藏在题面之外3.1 算法题不考难题但考你写代码的克制力小红书笔试的算法题相比大厂核心部门而言难度不算顶尖但这不是你松一口气的理由。第一批笔试出现的算法题更偏向高频经典题比如数组去重、两数之和、链表反转、二分查找这类以及部分需要结合贪心或双指针的题目。难点不在于你怎么想到解法而在于你能否在短时间内写出没有bug的代码。我有一个经验算法题不追求奇技淫巧老老实实用最稳的思路写。比如双指针能解决的问题不要为了展示技巧去写滑动窗口的复杂版本。笔试判题系统只认最终对不对不会因为你解法炫酷加分。你要做的是把边界条件处理好例如空数组、单个元素、负数、重复值、溢出情况。我见过不少同学思路全对但因为没有处理输入为空的情况丢了一半测试点。还有一个小技巧如果题目没有明确说明不能使用内置方法你可以放心使用比如排序用Array.prototype.sort、去重用Set但在注释里写明你的思路。有些同学担心用内置方法会被判“太low”其实在笔试环节能跑通比什么都重要。真正拉开差距的是工程代码题而不是手撕红黑树。3.2 前端代码题从手写一个Promise到上传大文件前端代码题是小红书笔试的特色我觉得这也是整个笔试里最值得认真准备的环节。常见的类型有手写防抖节流、实现一个简易的Promise.all、手写一个EventEmitter、实现一个带并发限制的请求池以及用Web Worker做大文件上传的分片处理逻辑。先说防抖和节流。这题看着简单但真要你从零手写很多人会漏掉“首次是否立即执行”和“结束后是否需要补执行”这两个细节。我建议你在笔试前把这两种工具函数的标准实现练到肌肉记忆同时想清楚它们的区别和使用场景防抖适合搜索框输入节流适合滚动事件监听。再说大文件上传。这也是2023年秋招的一个热门话题。小红书的笔试题目大概的意思是在不阻塞UI的情况下上传一个较大的文件你会怎么做你需要设计整体方案包括利用input[typefile]拿到File对象、通过Blob.prototype.slice将文件切成固定大小的分片、为每个分片计算MD5或文件内容的hash值然后再逐一发送并负责断点续传、失败重试与进度条展示。如果全程在主线程处理文件切片和hash计算会遇到编辑期间界面卡顿的问题准备方案是用Web Worker在后台线程完成切片和hash计算主线程只负责UI交互和请求调度。这里不一定要你写出完整代码但至少要能画出模块划分和关键函数。我这里给一个基于Worker的分片上传核心结构笔试时你可以直接按这个骨架来写// worker.js self.onmessage (event) { const { file, chunkSize } event.data; let start 0; while (start file.size) { const chunk file.slice(start, start chunkSize); // 这里可以计算当前分片的hash也可以直接返回给主线程 self.postMessage({ type: chunk, chunk, index: start / chunkSize }); start chunkSize; } self.postMessage({ type: done }); }; // main.js const worker new Worker(workerUrl); worker.onmessage (e) { if (e.data.type chunk) { // 调度上传控制并发数失败重试 uploadChunk(e.data).catch(() retry(e.data)); } };这里不能只写代码就完事还要说明你的并发控制策略。我在题后写的是“用并发池限制同时上传3个分片避免浏览器同一时刻建立太多连接导致性能下降”并且补了一句“服务端需要记录已上传的分片索引才能支持断点续传”。这种思路性表述同样会带来分数。因为出题人看的不只是代码还包括你是怎么思考工程问题的。3.3 在线OJ常见翻车点这个部分我单独拿出来说因为它和解题能力无关但翻车率极高。第一不要忽略输入输出格式。在线编程题有些是前端代码题直接写在浏览器里有些是标准ACM输入方式。如果你遇到标准输入格式至少提前熟悉readline和process.stdin的使用方式不能连标准输入怎么读都临时去搜。第二一定要先跑示例用例再提交。不要以为代码逻辑对了就一定能编译通过少个分号、变量名拼写错这类低级错误很常见。第三如果笔试环境允许自定义函数测试按钮尽量先写一个小用例自测尤其是边界值。很多人在自测用例通过后就直接交但漏掉的往往是空值、重复值和超大值。4. 场景设计题小红书真正想看的是你怎么把前端技术变成产品体验4.1 信息流场景性能题的本质是理解用户小红书是典型的内容社区产品首页信息流、笔记详情页、图片加载、搜索功能这些都是前端展示基本功的考验。场景设计题往往围绕这些真实业务展开让你设计某个功能模块。比如我当时遇到的题目大意是在用户快速滑动信息流时如果图片加载过慢你要怎么做这道题考察的点非常多。首先你要想到图片懒加载方案包括loadinglazy和IntersectionObserver两种方式并说明在什么场景下用哪个更合适。其次还要考虑图片地址拼接时生成不同尺寸的缩略图也就是CDN按需裁剪这样在信息流小图场景下不需要加载原图。再次快速滑动时可能出现大量图片请求占用带宽就要设计一个图片请求的调度机制比如优先加载当前可视区域的图片或者用队列控制并发数。如果你只答到“懒加载”就停笔最多拿一半分。需要更进一步的思路是如何处理快速滑动场景下的请求取消和内存释放。你可以说当某张图片所在卡片已经滑出可视区域时应中断对应图片的网络请求释放已解码但不可见的Image对象。这个点能够体现你对长列表性能的理解对页面内存溢出的敏感度挺关键。另外信息流场景免不了问“为什么不用虚拟列表”。在这类题目里如果能说出虚拟列表的实现要点——固定行高或预估行高、可视区渲染条数计算、滚动偏移换算起始索引、上下缓冲区的设置——会明显加分。你甚至可以结合小红书双列瀑布流布局来聊因为瀑布流不同卡片高度不一致虚拟化时还要解决错位测量问题这块内容如果你提前想过就能在场景题中和别人拉开差距。4.2 开放设计题别只写页面要写出系统场景设计题通常不止一道可能会让你设计一个不完全受限于页面现场的功能。比如我在复盘群看到有人讨论过这么一道题如果笔记编辑页需要支持草稿自动保存你会怎么设计这个问题表面上是实现一个自动保存功能实际上考察点包括防抖策略用户在连续输入时如何合并保存请求本地存储与服务器保存的分工是先用localStorage/IndexedDB做本地草稿还是直接请求接口多端同步用户可能在App端和Web端交替编辑草稿的合并冲突如何处理断网情况网络异常时草稿不丢失恢复后重试提交我在答题时先梳理了数据流和状态机再说明“本地优先”的策略同时使用版本号或更新时间戳来检测冲突。写代码时重点描述了防抖保存的实现以及利用navigator.onLine和offline事件来处理网络恢复后的同步。这种题目并不能靠背题解决需要平时对前端应用架构有自己的思考。4.3 工程化与微前端笔试里不直接考但场景题里会用到小红书这种规模的前端团队内部通常不会只维护一个单体仓库业务线多、团队多解决之道往往是工程化基建和微前端架构的混合体。笔试里的场景题虽然不会让你直接设计整套微前端方案但你有可能会碰到类似于“A部门有一个旧项目B部门想复用A项目的某个页面你怎么设计接入方案”这种开放式问题。这种情况下你需要对微前端的几种实现方案有基本的认识比如iframe隔离、Web Components、single-spa、qiankun或Module Federation。尤其要能说出Module Federation和常用方案的区别它不是在运行时加载整个应用的壳而是可以让不同构建产物共享模块适合团队间共享组件和依赖。答题时可以先说“如果只是复用页面最简单的方案是iframe嵌套但会遇到通信和样式隔离问题如果团队之间有长期共享需求我倾向于用Module Federation”。还有一个工程化问题是构建效率。这个不一定直接出题但可能会藏在功能设计题里。比如你设计完自动保存功能面试官追问“你们项目构建要3分钟你怎么让开发联调更高效”。如果你能说出Vite开发服务器按需编译、Webpack持久化缓存、拆包策略、以及用unplugin-auto-import减少手动导入就会显得你真的在工程环境里摸爬滚打过而不是只会写页面。5. 第一批笔试复盘清单我总结的备战顺序和避坑方案5.1 考后第一时间回顾题目比等结果更有价值笔试结束后很多人的第一反应是赶紧放松。但我强烈建议你在题目记忆还新鲜的时候立刻把每道题的考点和你的作答思路整理成一个文档。不是因为要发给谁而是这个过程能让你发现自己哪些地方是“真会”哪些是“背过”。我当时考完把自己每道题的判断都记了下来尤其是客观题里拿不准的选项。晚上和群里的同学对答案时才发现我对一道CSS层叠上下文的选择题理解完全错了。那道题考的是position: relative元素与z-index: auto之间的层叠关系我一直记成“只要设置了z-index就会有层叠上下文实际上只有z-index不是auto时才会创建”。这种细节靠刷题很难刷到只有考后复盘才能暴露出来。5.2 高频易错点自查表我把小红书第一批笔试前后我在复习中反复遇到的易错点整理成一张自查清单你在备考时可以逐项打勾事件循环能否画出一个异步代码的执行顺序图Promise能否手写一个符合规范的Promise.all而不是只背用法深拷贝能否处理循环引用、Symbol、特殊对象防抖节流能否写出支持立即执行和尾部调用的版本浏览器渲染能否说明CSS、JS、图片分别如何阻塞渲染缓存能否完整描述强缓存与协商缓存的流程安全能否分别举出XSS和CSRF的攻击示例与防御手段大文件上传能否说清切片、哈希、并发控制、断点续传微前端能否比较iframe、single-spa、Module Federation的优劣其中“防抖节流支持立即执行和尾部调用”是很多人写不出来的这里我贴一个相对完整的防抖实现你可以对照着检查自己能不能讲明白每一行function debounce(func, wait, immediate false) { let timer null; let result; return function (...args) { const context this; if (timer) clearTimeout(timer); if (immediate) { const callNow !timer; timer setTimeout(() { timer null; }, wait); if (callNow) { result func.apply(context, args); } } else { timer setTimeout(() { func.apply(context, args); }, wait); } return result; }; }注意这里最关键的是callNow !timer在第一次触发时timer为空所以立即执行之后在等待期内timer非空不再执行等待期结束后timer被置空下一次触发又可以立即执行。这个逻辑很多人背不住是因为没有亲手推导过。5.3 复试与面试衔接笔试之后该准备什么如果笔试通过小红书后续一般是两到三轮技术面试。面试的考察重点和笔试不太一样笔试看你能不能写对面试看你为什么这么写、还有没有更好的方案。因此笔试结束后不要立刻把题目扔掉可以在场景题的基础上继续扩展成一个小项目或Demo面试时才有东西可聊。我当时笔试考了大文件上传后花了几天时间用React Node写了一个完整的本地分片上传demo前端用Web Worker做切片和哈希计算后端用Node的fs模块接收并合并分片。这段经历在后续面试讲项目时非常加分因为面试官会追问“你hash计算的时候有没有考虑大量文件导致的性能问题”“服务端怎么校验分片完整性”“如果用户中途关闭页面断点续传如何恢复”。这些问题如果没有实际写过一个项目很容易答得空泛。5.4 我的几点真实体会最后想说一点经验之谈。2023年秋招前端岗位的要求已经不是“会写页面、会调接口”就能过关了。小红书第一批笔试给我的最大感受是它考察的是系统性的前端思维方式写一行代码时你知不知道它背后的浏览器行为做一个功能时你知不知道它会影响哪些性能指标提一个方案时你知不知道还有什么备选方案。如果你现在还有时间准备建议按这个顺序投入精力先把JavaScript和浏览器机制吃透这是笔试的基本盘然后刷高频手写代码题确保能在一个小时内写出干净的基础实现再去做场景题的专项训练练习如何从产品需求出发拆解技术方案最后才是追新框架和装修简历。这个顺序反过来容易导致“看起来会很多一考就露馅”。笔试只是秋招长跑里的一环它不会决定你的全部价值但它是一场很诚实的检验。如果你也正在准备下一届秋招希望这篇复盘能让你少走一点弯路提前刷熟高频题合理分配时间注意在线编程的输入输出格式最关键是别把知识背成答案而是把它理解成工程决策的一部分。用这种方法去面对笔试哪怕结果不是满分你也会发现收获比单纯拿offer更多。 小红书前端笔试复盘：从事件循环到大文件上传的备战之路
2023年秋招那会儿前端岗的竞争烈度从投出简历的第一天就能感受到。我报名小红书前端岗之后等来的是“第一批笔试”的通知当时心里其实没底网上关于小红书面经的帖子不少但大多是零零散散的面试题回忆极少有人认真拆解笔试环节本身。现在秋招已经告一段落我把那批笔试的复盘整理成文连同我和同批考生考后交流的反馈一起写出来。这篇文章不是背题答案而是想告诉你小红书前端笔试到底在筛什么样的人哪些地方容易翻车以及准备2026届秋招时可以直接照抄的复习路径。1. 笔试基本盘题目结构决定你要在哪些能力上下注1.1 我拿到的卷子长什么样小红书的前端笔试很少出偏题怪题但覆盖面非常广而且节奏紧凑。第一批笔试整体分为三个模块基础客观题、在线编程题、场景设计题。客观题部分集中在浏览器原理、JavaScript语言机制、CSS布局、网络协议以及少量安全知识在线编程题中既有通用算法题也有需要手写前端代码的题目场景设计题通常给你一个产品需求让你写出技术方案或核心代码片段。当时我身边的同学最普遍的反应是“写不完”。这不是因为题目量有多大而是每道题都需要你写真实的代码片段或详细的思路说明而不是选完答案就完事。比如客观题里会有“以下代码输出什么”这类题目看起来是选择题实际上你必须在心里跑一遍事件循环、作用域链和类型转换光靠背八股答案是拿不准的。我整理了一下当时大家反馈的题型占比大致是这样模块常见形式占比主观感受核心考察点基础客观题单选、多选、判断40%JS、浏览器、CSS、网络、安全在线编程题一个OJ算法题 一个前端代码题40%算法思维、JS功底、编码规范场景设计题产品功能描述 开放作答20%技术选型、工程落地、交互体验这个结构说明一件事笔试不是单纯筛代码机器它还看你能不能把前端知识落到实际业务上。尤其是场景设计题小公司笔试基本不会出现小红书这类偏重产品体验的技术团队非常喜欢用这一题来拉开差距。1.2 时间分配是第一道隐形的题先说结论如果你拿到卷子就开始从头到尾按顺序做题大概率会翻车。我自己的建议是拿到卷子先花3分钟浏览全部题目按分值和你自己的把握程度排优先级而不是硬磕前面的难题。基础客观题涉及的知识点很碎容易让人陷进去。我见过有同学在一道关于CSS层叠上下文的题目上抠了十几分钟最后留给场景设计题只剩五分钟只能草草写两行思路。正确的节奏应该是客观题控制在40到50分钟内完成编程题留出50分钟场景设计题至少留出25分钟。如果某道客观题没有把握先标记不要恋战。另外在线笔试平台通常有摄像头监控和切屏限制这个大家应该都知道但我还是想提醒一句提前半小时把Chrome插件、后台自动更新全部关掉避免不必要的拦截记录。我笔试那天就碰到过一位同学因为电脑自动弹窗被后台记录了一次虽然最后成绩没受影响但她整场考试都特别紧张心态很容易崩。2. 基础考点复盘那些看似简单却答不完整的题目2.1 JavaScript机制类问题背答案和真正懂是两码事小红书笔试的JS部分出题人非常喜欢考“运行结果题”也就是给你一段代码让你选择输出顺序。这类题我建议你在备考时不要只看结论而是把每条规则都推导一遍。我考完后回忆了一下出现频率较高的知识点包括Promise、async/await、微任务与宏任务的执行顺序闭包在循环中的表现this的绑定规则类型转换和隐式转换原型链与继承比如事件循环几乎是必考。你得把“本轮宏任务执行完 - 清空微任务队列 - 进入下一轮宏任务”这个流程刻在脑子里同时要清楚Promise的then回调注册时机。曾有同学问过我“为什么async函数里await后面的代码有时看起来像同步执行”这个问题的本质是await会把后续代码包装成微任务但如果你不理解执行时机遇到嵌套的Promise就只能靠猜。还有一个高频点是深拷贝。很多人能写出JSON.parse(JSON.stringify(obj))但笔试不会这么简单它往往要求你处理循环引用、Symbol、Date、RegExp这些特殊类型并且要手写实现。我建议把深拷贝作为必练题目因为你背再多的“面试题汇总”到了考场上还是要手写。2.2 浏览器、CSS与网络信息密度最高的得分区这部分常被部分前端准备者忽略因为它不像JS八股那样天天刷屏但小红书测试得很扎实。我在笔试里遇到的CSS问题大多围绕flex与grid布局差异、BFC、层叠上下文、垂直水平居中这些基础点。技术高手有时会轻视这类题目但实际上CSS题最能看出一个人的基本功是否成体系因为零散记忆的人会写出多套堆叠的兼容性hack而真正理解CSS的人会给出简洁的方案。网络方面Cache-Control、ETag、强缓存与协商缓存的流程几乎属于送分题但送分的前提是你真的能把整个协商过程说清楚。还有一道我印象很深的题在输入URL到页面显示的完整流程中哪些环节可以优化这个问题看似考察性能优化实际上考验你对DNS、HTTP、渲染进程、脚本解析、CSSOM构建全链路的理解。只背“加CDN、合并请求、压缩静态资源”这种结论是拿不到高分的你需要能指出每个环节对应的优化手段。浏览器进程模型和渲染原理也是高频考点。当时一起笔试的朋友在复习群里讲了个很形象的类比浏览器主线程就像餐厅里既要点菜又要传菜的服务员CSS阻塞渲染相当于菜单没印出来就不能点菜JS阻塞又相当于后厨占用过道导致传菜卡住。你在做题时也用这种类比去推渲染过程会发现很好记答题时还能写得生动。比如重排和重绘的区别不能只回答“重排性能开销更大”要点出重排一定会引起重绘、反之不一定并且最好能结合display:none和visibility:hidden的例子来说明。安全方面XSS和CSRF是必背项。小红书这类社区型产品非常重视内容安全笔试里出现这类题并不意外。你要能说清楚XSS的注入点、常见绕过方式以及防御方案包括针对输入做白名单校验、输出转义、CSP设置等。CSRF则要讲明白为什么需要SameSite和校验Token。3. 在线编程环节踩分点藏在题面之外3.1 算法题不考难题但考你写代码的克制力小红书笔试的算法题相比大厂核心部门而言难度不算顶尖但这不是你松一口气的理由。第一批笔试出现的算法题更偏向高频经典题比如数组去重、两数之和、链表反转、二分查找这类以及部分需要结合贪心或双指针的题目。难点不在于你怎么想到解法而在于你能否在短时间内写出没有bug的代码。我有一个经验算法题不追求奇技淫巧老老实实用最稳的思路写。比如双指针能解决的问题不要为了展示技巧去写滑动窗口的复杂版本。笔试判题系统只认最终对不对不会因为你解法炫酷加分。你要做的是把边界条件处理好例如空数组、单个元素、负数、重复值、溢出情况。我见过不少同学思路全对但因为没有处理输入为空的情况丢了一半测试点。还有一个小技巧如果题目没有明确说明不能使用内置方法你可以放心使用比如排序用Array.prototype.sort、去重用Set但在注释里写明你的思路。有些同学担心用内置方法会被判“太low”其实在笔试环节能跑通比什么都重要。真正拉开差距的是工程代码题而不是手撕红黑树。3.2 前端代码题从手写一个Promise到上传大文件前端代码题是小红书笔试的特色我觉得这也是整个笔试里最值得认真准备的环节。常见的类型有手写防抖节流、实现一个简易的Promise.all、手写一个EventEmitter、实现一个带并发限制的请求池以及用Web Worker做大文件上传的分片处理逻辑。先说防抖和节流。这题看着简单但真要你从零手写很多人会漏掉“首次是否立即执行”和“结束后是否需要补执行”这两个细节。我建议你在笔试前把这两种工具函数的标准实现练到肌肉记忆同时想清楚它们的区别和使用场景防抖适合搜索框输入节流适合滚动事件监听。再说大文件上传。这也是2023年秋招的一个热门话题。小红书的笔试题目大概的意思是在不阻塞UI的情况下上传一个较大的文件你会怎么做你需要设计整体方案包括利用input[typefile]拿到File对象、通过Blob.prototype.slice将文件切成固定大小的分片、为每个分片计算MD5或文件内容的hash值然后再逐一发送并负责断点续传、失败重试与进度条展示。如果全程在主线程处理文件切片和hash计算会遇到编辑期间界面卡顿的问题准备方案是用Web Worker在后台线程完成切片和hash计算主线程只负责UI交互和请求调度。这里不一定要你写出完整代码但至少要能画出模块划分和关键函数。我这里给一个基于Worker的分片上传核心结构笔试时你可以直接按这个骨架来写// worker.js self.onmessage (event) { const { file, chunkSize } event.data; let start 0; while (start file.size) { const chunk file.slice(start, start chunkSize); // 这里可以计算当前分片的hash也可以直接返回给主线程 self.postMessage({ type: chunk, chunk, index: start / chunkSize }); start chunkSize; } self.postMessage({ type: done }); }; // main.js const worker new Worker(workerUrl); worker.onmessage (e) { if (e.data.type chunk) { // 调度上传控制并发数失败重试 uploadChunk(e.data).catch(() retry(e.data)); } };这里不能只写代码就完事还要说明你的并发控制策略。我在题后写的是“用并发池限制同时上传3个分片避免浏览器同一时刻建立太多连接导致性能下降”并且补了一句“服务端需要记录已上传的分片索引才能支持断点续传”。这种思路性表述同样会带来分数。因为出题人看的不只是代码还包括你是怎么思考工程问题的。3.3 在线OJ常见翻车点这个部分我单独拿出来说因为它和解题能力无关但翻车率极高。第一不要忽略输入输出格式。在线编程题有些是前端代码题直接写在浏览器里有些是标准ACM输入方式。如果你遇到标准输入格式至少提前熟悉readline和process.stdin的使用方式不能连标准输入怎么读都临时去搜。第二一定要先跑示例用例再提交。不要以为代码逻辑对了就一定能编译通过少个分号、变量名拼写错这类低级错误很常见。第三如果笔试环境允许自定义函数测试按钮尽量先写一个小用例自测尤其是边界值。很多人在自测用例通过后就直接交但漏掉的往往是空值、重复值和超大值。4. 场景设计题小红书真正想看的是你怎么把前端技术变成产品体验4.1 信息流场景性能题的本质是理解用户小红书是典型的内容社区产品首页信息流、笔记详情页、图片加载、搜索功能这些都是前端展示基本功的考验。场景设计题往往围绕这些真实业务展开让你设计某个功能模块。比如我当时遇到的题目大意是在用户快速滑动信息流时如果图片加载过慢你要怎么做这道题考察的点非常多。首先你要想到图片懒加载方案包括loadinglazy和IntersectionObserver两种方式并说明在什么场景下用哪个更合适。其次还要考虑图片地址拼接时生成不同尺寸的缩略图也就是CDN按需裁剪这样在信息流小图场景下不需要加载原图。再次快速滑动时可能出现大量图片请求占用带宽就要设计一个图片请求的调度机制比如优先加载当前可视区域的图片或者用队列控制并发数。如果你只答到“懒加载”就停笔最多拿一半分。需要更进一步的思路是如何处理快速滑动场景下的请求取消和内存释放。你可以说当某张图片所在卡片已经滑出可视区域时应中断对应图片的网络请求释放已解码但不可见的Image对象。这个点能够体现你对长列表性能的理解对页面内存溢出的敏感度挺关键。另外信息流场景免不了问“为什么不用虚拟列表”。在这类题目里如果能说出虚拟列表的实现要点——固定行高或预估行高、可视区渲染条数计算、滚动偏移换算起始索引、上下缓冲区的设置——会明显加分。你甚至可以结合小红书双列瀑布流布局来聊因为瀑布流不同卡片高度不一致虚拟化时还要解决错位测量问题这块内容如果你提前想过就能在场景题中和别人拉开差距。4.2 开放设计题别只写页面要写出系统场景设计题通常不止一道可能会让你设计一个不完全受限于页面现场的功能。比如我在复盘群看到有人讨论过这么一道题如果笔记编辑页需要支持草稿自动保存你会怎么设计这个问题表面上是实现一个自动保存功能实际上考察点包括防抖策略用户在连续输入时如何合并保存请求本地存储与服务器保存的分工是先用localStorage/IndexedDB做本地草稿还是直接请求接口多端同步用户可能在App端和Web端交替编辑草稿的合并冲突如何处理断网情况网络异常时草稿不丢失恢复后重试提交我在答题时先梳理了数据流和状态机再说明“本地优先”的策略同时使用版本号或更新时间戳来检测冲突。写代码时重点描述了防抖保存的实现以及利用navigator.onLine和offline事件来处理网络恢复后的同步。这种题目并不能靠背题解决需要平时对前端应用架构有自己的思考。4.3 工程化与微前端笔试里不直接考但场景题里会用到小红书这种规模的前端团队内部通常不会只维护一个单体仓库业务线多、团队多解决之道往往是工程化基建和微前端架构的混合体。笔试里的场景题虽然不会让你直接设计整套微前端方案但你有可能会碰到类似于“A部门有一个旧项目B部门想复用A项目的某个页面你怎么设计接入方案”这种开放式问题。这种情况下你需要对微前端的几种实现方案有基本的认识比如iframe隔离、Web Components、single-spa、qiankun或Module Federation。尤其要能说出Module Federation和常用方案的区别它不是在运行时加载整个应用的壳而是可以让不同构建产物共享模块适合团队间共享组件和依赖。答题时可以先说“如果只是复用页面最简单的方案是iframe嵌套但会遇到通信和样式隔离问题如果团队之间有长期共享需求我倾向于用Module Federation”。还有一个工程化问题是构建效率。这个不一定直接出题但可能会藏在功能设计题里。比如你设计完自动保存功能面试官追问“你们项目构建要3分钟你怎么让开发联调更高效”。如果你能说出Vite开发服务器按需编译、Webpack持久化缓存、拆包策略、以及用unplugin-auto-import减少手动导入就会显得你真的在工程环境里摸爬滚打过而不是只会写页面。5. 第一批笔试复盘清单我总结的备战顺序和避坑方案5.1 考后第一时间回顾题目比等结果更有价值笔试结束后很多人的第一反应是赶紧放松。但我强烈建议你在题目记忆还新鲜的时候立刻把每道题的考点和你的作答思路整理成一个文档。不是因为要发给谁而是这个过程能让你发现自己哪些地方是“真会”哪些是“背过”。我当时考完把自己每道题的判断都记了下来尤其是客观题里拿不准的选项。晚上和群里的同学对答案时才发现我对一道CSS层叠上下文的选择题理解完全错了。那道题考的是position: relative元素与z-index: auto之间的层叠关系我一直记成“只要设置了z-index就会有层叠上下文实际上只有z-index不是auto时才会创建”。这种细节靠刷题很难刷到只有考后复盘才能暴露出来。5.2 高频易错点自查表我把小红书第一批笔试前后我在复习中反复遇到的易错点整理成一张自查清单你在备考时可以逐项打勾事件循环能否画出一个异步代码的执行顺序图Promise能否手写一个符合规范的Promise.all而不是只背用法深拷贝能否处理循环引用、Symbol、特殊对象防抖节流能否写出支持立即执行和尾部调用的版本浏览器渲染能否说明CSS、JS、图片分别如何阻塞渲染缓存能否完整描述强缓存与协商缓存的流程安全能否分别举出XSS和CSRF的攻击示例与防御手段大文件上传能否说清切片、哈希、并发控制、断点续传微前端能否比较iframe、single-spa、Module Federation的优劣其中“防抖节流支持立即执行和尾部调用”是很多人写不出来的这里我贴一个相对完整的防抖实现你可以对照着检查自己能不能讲明白每一行function debounce(func, wait, immediate false) { let timer null; let result; return function (...args) { const context this; if (timer) clearTimeout(timer); if (immediate) { const callNow !timer; timer setTimeout(() { timer null; }, wait); if (callNow) { result func.apply(context, args); } } else { timer setTimeout(() { func.apply(context, args); }, wait); } return result; }; }注意这里最关键的是callNow !timer在第一次触发时timer为空所以立即执行之后在等待期内timer非空不再执行等待期结束后timer被置空下一次触发又可以立即执行。这个逻辑很多人背不住是因为没有亲手推导过。5.3 复试与面试衔接笔试之后该准备什么如果笔试通过小红书后续一般是两到三轮技术面试。面试的考察重点和笔试不太一样笔试看你能不能写对面试看你为什么这么写、还有没有更好的方案。因此笔试结束后不要立刻把题目扔掉可以在场景题的基础上继续扩展成一个小项目或Demo面试时才有东西可聊。我当时笔试考了大文件上传后花了几天时间用React Node写了一个完整的本地分片上传demo前端用Web Worker做切片和哈希计算后端用Node的fs模块接收并合并分片。这段经历在后续面试讲项目时非常加分因为面试官会追问“你hash计算的时候有没有考虑大量文件导致的性能问题”“服务端怎么校验分片完整性”“如果用户中途关闭页面断点续传如何恢复”。这些问题如果没有实际写过一个项目很容易答得空泛。5.4 我的几点真实体会最后想说一点经验之谈。2023年秋招前端岗位的要求已经不是“会写页面、会调接口”就能过关了。小红书第一批笔试给我的最大感受是它考察的是系统性的前端思维方式写一行代码时你知不知道它背后的浏览器行为做一个功能时你知不知道它会影响哪些性能指标提一个方案时你知不知道还有什么备选方案。如果你现在还有时间准备建议按这个顺序投入精力先把JavaScript和浏览器机制吃透这是笔试的基本盘然后刷高频手写代码题确保能在一个小时内写出干净的基础实现再去做场景题的专项训练练习如何从产品需求出发拆解技术方案最后才是追新框架和装修简历。这个顺序反过来容易导致“看起来会很多一考就露馅”。笔试只是秋招长跑里的一环它不会决定你的全部价值但它是一场很诚实的检验。如果你也正在准备下一届秋招希望这篇复盘能让你少走一点弯路提前刷熟高频题合理分配时间注意在线编程的输入输出格式最关键是别把知识背成答案而是把它理解成工程决策的一部分。用这种方法去面对笔试哪怕结果不是满分你也会发现收获比单纯拿offer更多。