字节架构前端

介绍 创意魔方是 ImageX 提供的一个图片编辑与合成组件，在需要生成大量类似海报、图片的情况下，只需要创建好通用的样式，就可以通过使用不同的参数调用 OpenAPI 生成需要的大量图片。 创意魔方

背景 Web视频编辑器即基于浏览器的视频编辑工具，可以实现视频拼接、滤镜等功能点，一般包含视频导入、预览和导出功能。在众多编辑器中，绝大部分编辑器选择了服务端导出，因为服务端编解码能力更强，导出速度更

简介 Lighthouse 是谷歌开源的一款 Web 前端性能测试工具，它将针对此页面运行一连串的测试，然后生成一个有关页面性能的报告。本文中仅对 Performance 部分的指标进行介绍。 Per

Web多媒体 基础知识 编码格式 图像基本概念 图像分辨率：用于确定组成一副图像的像素数据，就是指在水平和垂直方向上图像所具有的像素个数。 图像深度：图像深度是指存储每个像素所需要的比特数。图像深度决

lint类工具是我们在前端开发工作中经常的工具，比如eslint和stylelint。lint可以帮助我们发现代码中可能存在的错误，有时候我们也会利用其提供的api来实现一些自定义的代码检查。但我们其

WebP介绍 WebP 是 Google 推出的一种同时提供了有损和无损两种压缩方式的图片格式，优势体现在其优秀的图像压缩算法，能够带来更小的图片体积，同时拥有更高的的图像质量。根据官方说明，WebP

File System Access API 使开发者能够构建更强大的web应用程序，与用户设备上的文件进行交互。除了文件读取功能，添加了新的接口，支持实时修改并保存以及操作目录。

使用 DASH 直播时一般会有几十秒的直播延迟，对于互动直播这么高的延迟根本互不动。要降低直播延迟一般会减少视频分段时长。 上图中展示了不同时长的视频片段对应的延迟，减小视频片段时长虽然可以降低延迟，

先上灵魂拷问 在文章之前，先抛一些灵魂拷问： 前端代码从 tsx/jsx 到部署上线被用户访问，中间大致会经历哪些过程？ 上述过程中分别都有哪些考虑、指标和优化点，以满足复杂的业务需求？ 可能大部分同