字节架构前端

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

通过对 Git 底层 API 的使用来了解其存储结构与工作原理，通过了解工作原理可以帮助我们更好地解决各类 Git 代码版本管理操作上的问题。...

什么是 WebGPU WebGPU 是一套全新的 Web API 标准，旨在提供高性能 3D 图形和数据并行计算能力，暴露了一系列现代 GPU 能力。基于成熟的 Vulka...

一、背景 预加载可以在网页全部加载之前，对一些主要内容进行加载，以提供给用户更好的体验，减少等待的时间。但是，一些情况下，我们还需要对预加载的资源优先级进行进一步的划分。预...

概述 无论是为了更高效的团队协作，还是改进代码管理，Monorepo 都是一种有效的方案。本文用「5W1H」带你了解以下内容： 「What」什么是 Monorepo ？ 「...

简述 Slardar 前端监控自18年底开始建设以来，从仅仅作为 Sentry 的替代，经历了一系列迭代和发展，目前做为一个监控解决方案，已经应用到抖音、西瓜、今日头条等众...

菲茨定律 Fitts' Law 费茨法则 是一个人机交互以及人体工程学中人类活动的模型，它预测了快速移动到目标区域所需的时间是目标区域的距离和目标区域的大小的函数。费茨法则...

写在前面 状态管理库伴随着数据驱动类框架诞生以来，一直都是个带争议的话题，社区里关于这个方向的讨论文章也是数不胜数，本文写作的目的并不是去详细解答每一款状态库的设计原理和最...

一、Webpack 现状 最初的 Webpack 主打 Bundle 并且支持「Code Splitting」；在经过一段爆发式增长后，最有用的功能之一：热更新 Hot M...

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

简介 本文介绍 Chrome DevTools Performance 面板的所有功能，以便使用其分析页面加载时/运行时性能，找出性能瓶颈。 功能面板概览 控制面板（红色区...

前言 前端框架一路走来，从最原始的DOM操作，到jQuery-like之类的DOM操作工具库，再到后来的AMD、 CMD模块化开发，以及后续涌现出的一系列MVC、MVVM框...

背景 初学者怎么用react-three-fiber实现一个炫酷粒子效果的首页 Three.js工作原理 场景(Scene)、相机(Camera)和渲染器(Renderer...

WebXR 是一组支持将渲染 3D 场景用来呈现虚拟世界（虚拟现实，也称作VR）或将图形图像添加到现实世界（增强现实，也称作AR）的标准。 通过该 API 可以访问 VR/...

react18新特性 一、 Render API 三种入口模式 legacy 模式： ReactDOM.render(, rootNode)。没有开启新功能，这是react...

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

小明是个个人开发者，自己准备写了个论坛，基本业务快写完了，要来处理下用户认证逻辑。 之前没搞过啊，上网找找看。好，有个 basic auth，看起来很简单啊，就这么干 ba...

前言 本文探索了使用SharedArrayBuffer（以后简称sab）、web worker、Atomics API进行多线程编程的可行性，并构建了一个视频处理场景进行对...

背景 debug的重要性对于我们来说不言而喻，那debug背后又有多少协议在做着默默地付出呢，这也主要是本文要介绍的内容。 Node Debug Debug的划分 如何de...