字节AML 前端一面

以下是对字节 AML 前端一面可能的分析与回答思路整理，帮助你更好复盘和准备后续面试：

一、项目经历相关问题

实习经历，介绍小红书做的性能优化和指标的事情
核心要点：需清晰阐述性能优化的具体方向（如加载速度、渲染性能等）、采取的措施（代码优化、资源压缩、缓存策略等）以及指标的衡量方式（如通过哪些工具监测指标变化、优化前后指标对比数据等）。
示例回答：在小红书实习期间，我主要负责页面加载性能优化。通过分析发现部分图片资源过大影响加载速度，于是采用图片压缩和懒加载技术，将图片大小平均压缩 30%，同时使用 Intersection Observer API 实现图片懒加载。在指标衡量上，使用 Lighthouse 工具监测页面性能得分，优化前得分 60 分，优化后提升至 85 分，首屏加载时间从 3s 缩短至 1.5s。

二、指标相关问题

FMP 指标在中后台场景的意义，为什么不用 LCP 处理
核心要点：解释 FMP（First Meaningful Paint，首次有意义渲染）和 LCP（Largest Contentful Paint，最大内容渲染）的概念，说明 FMP 在中后台场景能更好反映用户首次看到关键内容的时间，而 LCP 可能受一些非关键大元素影响不能准确体现核心内容加载情况。
示例回答：FMP 指标在中后台场景中，能标识出页面首次渲染出对用户有意义内容的时间点，对于中后台复杂页面，用户更关注核心业务内容的展示，FMP 可以准确反映这部分内容的加载进度。而 LCP 只是衡量页面中最大元素的渲染时间，这个最大元素可能并非用户关注的核心业务内容，比如一个大的背景图片或装饰元素，所以用 FMP 更能贴合中后台场景需求。
为什么作为实习生能接触和承担这些有难度的指标算法任务
核心要点：从自身学习能力、对技术的热情、过往相关经验或知识储备、团队信任与培养等方面阐述。
示例回答：一方面，我对前端性能优化和指标算法有浓厚兴趣，在实习前就自主学习了大量相关知识，如阅读了《Web 性能权威指南》等书籍，对性能指标有深入理解。另一方面，在实习期间我展现出了较强的学习能力和执行力，能快速掌握新知识和技能，并且积极主动承担任务，之前完成的一些小项目也得到了团队认可，所以团队愿意给我机会接触和承担这些有难度的任务。

三、浏览器原理与性能优化问题

从 URL 输入到浏览器发生的所有过程中，哪些可以进行性能优化
核心要点：分阶段阐述，包括 DNS 查询、TCP 连接、HTTP 请求、服务器处理、浏览器渲染等阶段，每个阶段提出相应优化措施。
示例回答：
DNS 查询：使用 DNS 缓存，减少重复查询；采用 DNS 预解析，提前解析可能访问的域名。
TCP 连接：复用 TCP 连接，如使用 HTTP Keep - Alive；采用连接池技术管理 TCP 连接。
HTTP 请求：压缩请求和响应数据，减少传输量；合并多个小请求为大请求，减少请求次数；使用 CDN 加速资源获取。
服务器处理：优化服务器代码逻辑，提高处理效率；采用缓存策略，如 Redis 缓存常用数据。
浏览器渲染：优化 CSS 和 JavaScript 加载和执行，如将 CSS 放在头部，JavaScript 放在底部或使用异步加载；减少 DOM 操作，使用文档片段（DocumentFragment）进行批量操作。

四、Vue 相关问题

细谈 vue - component
核心要点：介绍 Vue 组件的基本概念、组件化开发的优势（如代码复用、提高开发效率、便于维护等）、组件的注册方式（全局注册和局部注册）、组件间的通信方式（props、$emit、事件总线、Vuex 等）。
示例回答：Vue 组件是可复用的 Vue 实例，它将页面的某个部分封装起来，包含自己的模板、逻辑和数据。组件化开发可以提高代码复用性，不同项目或页面中相同的 UI 部分可以复用同一组件；还能提高开发效率，多个开发者可以同时开发不同组件；并且便于维护，当某个部分出现问题时，只需修改对应组件即可。组件注册有全局注册和局部注册两种方式，全局注册的组件可以在任何 Vue 实例中使用，局部注册的组件只能在当前 Vue 实例中使用。组件间通信常用 props 向下传递数据，$emit 向上触发事件，还可以使用事件总线或 Vuex 进行跨组件通信。
vue 里的一些插件可以怎么做：不会，只讲了拿 vite 写插件的一些思路，还有做脚手架的思路
核心要点：若对 Vue 插件不太熟悉，可重点阐述 Vite 插件和脚手架思路。Vite 插件可通过拦截和修改模块请求、添加新的构建功能等方式扩展 Vite 能力；脚手架思路包括确定项目结构、配置基本依赖、封装常用命令等。
示例回答：对于 Vue 插件不太深入了解，但我知道 Vite 插件的编写思路。Vite 插件主要通过在 vite.config.js 中配置 plugins 数组，每个插件是一个对象，包含 name 等属性和 transform、load 等钩子函数。通过这些钩子函数可以拦截模块请求，对模块内容进行修改，或者添加新的构建功能。关于脚手架思路，首先确定项目的基本结构，如 src 目录存放源代码，public 目录存放静态资源等；然后配置项目依赖，如 Vue、Vue Router、Vuex 等；最后封装常用命令，如启动开发服务器、打包生产环境代码等命令，方便开发者使用。

五、代码实现问题

写实现一个 request，可以在失败的时候重试，有 interval 和 maxCount 参数
核心要点：使用递归或循环实现重试逻辑，在每次请求失败后，根据 interval 参数等待一定时间，然后再次发起请求，直到达到 maxCount 参数指定的最大重试次数。
示例代码（JavaScript）：

用 Array 实现 Set：写了一半 API 记不清了
核心要点：实现 Set 的基本功能，如添加元素、判断元素是否存在、删除元素等，可参考 Set 的常见 API 进行实现。
示例代码（JavaScript）：

class MySet { constructor() { this.items = []; } add(value) { if (!this.has(value)) { this.items.push(value); return true; } return false; } has(value) { return this.items.indexOf(value)!== -1; } delete(value) { const index = this.items.indexOf(value); if (index!== -1) { this.items.splice(index, 1); return true; } return false; } size() { return this.items.length; } // 其他可能的方法如 clear 等可根据需要实现}六、其他问题

讲讲怎么接触这些技术方案的：聊了学 langchain 借鉴京东云团队的文章，包括 qwick 无水合的一些详细思路
核心要点：说明获取技术方案的途径，如阅读技术博客、开源项目、参加技术交流活动等，以及如何从这些资源中学习和借鉴思路。
示例回答：我主要通过阅读技术博客和开源项目来接触这些技术方案。比如学习 langchain 时，在京东云团队的技术文章中了解到其应用场景和实现思路，然后自己进行实践和探索。对于 qwick 无水合思路，是在开源项目中看到相关实现，通过研究代码和文档，理解其原理和优势，并思考如何应用到自己的项目中。
反问：机器学习平台
核心要点：可以询问机器学习平台在字节的应用场景、技术栈、团队目前的研究方向等问题，展示对公司的关注和兴趣。
示例反问：请问字节的机器学习平台主要应用在哪些业务场景中？平台采用的主要技术栈是什么？团队目前在机器学习领域有哪些重点研究方向？
评价：技术面和工作能力强，基础再多巩固
核心要点：针对评价中的优点继续保持，对于基础巩固方面，制定学习计划，加强对前端基础知识（如 HTML、CSS、JavaScript 核心概念、数据结构与算法等）的学习和练习。
示例行动：每天安排一定时间复习前端基础知识，通过做在线编程题目、阅读经典书籍等方式加深理解；参与开源项目或自己搭建小项目，将所学知识应用到实际中，提高实践能力。

您可能感兴趣问答

Collapsible

热门标签

热点问答