feat: 初始化

Author: zhangdong

.vitepress/config.mts

@@ -94,7 +94,10 @@ export default defineConfig({
       "/brower/": [
         {
           text: "浏览器",
-          items: [{ text: "深入了解现代网络浏览器", link: "/brower/overview" }],
+          items: [
+            { text: "深入了解现代网络浏览器", link: "/brower/overview" },
+            { text: "性能指标", link: "/brower/performanceTags" },
+          ],
         },
       ],
       "/optimization/": [

brower/imgs/image1.png

@@ -9,13 +9,25 @@ cpu(Central Processing Unit) gpu(Graphics Processing Unit) 是浏览器的核心
 
 进程可以描述为应用程序的执行程序。线程存在于进程内部并执行其进程程序的任何部分。
 
-当您启动应用程序时，会创建一个进程。程序可能会创建线程来帮助其工作，但这是可选的。操作系统为进程提供了一块“内存”供其使用，并且所有应用程序状态都保存在该私有内存空间中。当您关闭应用程序时，进程也会消失，操作系统会释放内存。
+当您启动应用程序时，会创建一个进程。程序可能会创建线程来帮助其工作。操作系统为进程提供了一块“内存”供其使用，并且所有应用程序状态都保存在该私有内存空间中。当您关闭应用程序时，进程也会消失，操作系统会释放内存。
 
 进程可以请求操作系统启动另一个进程来运行不同的任务。当这种情况发生时，内存的不同部分将分配给新进程。如果两个进程需要通信，它们可以使用进程间通信 (IPC) 进行通信
-
-
+## 谷歌浏览器的架构
+最顶层是browser，它与负责应用程序不同部分的其他进程进行协调。对于渲染器进程，会创建多个进程并将其分配给每个选项卡
+![alt text](./imgs/image1.png)
+
+| Process  | What it controls |
+|----------|------------------|
+| Browser  | 控制应用的chrome部分, 包括地址栏,书签,前进后退按钮.也处理不可见的权限部分,例如网络请求和文件访问. |
+| Renderer | 控制选项卡下网站展示的部分 |
+| Plugin   | 控制网站使用的任何插件，例如 flash. |
+| GPU      | 处理GPU任务,独立于其他进程.它被分成不同的进程，因为 GPU 处理来自多个应用程序的请求并将它们绘制在同位置. |
+
+还有更多进程，例如扩展进程和实用程序进程。
 ## 导航
 重点介绍用户请求网站和浏览器准备呈现页面的部分，从browser Process开始
+
+标签之外的所有内容均由浏览器进程处理。浏览器进程具有多个线程，例如绘制浏览器按钮和输入字段的 UI 线程、处理网络堆栈以从互联网接收数据的网络线程、控制文件访问的存储线程等。当您在地址栏中键入 URL 时，您的输入由浏览器进程的 UI 线程处理。
 ### 处理input
 当用户尝试在地址栏输入，UI thread 会询问这是一个搜索查询还是URL,因此UI thread 需要解析并决定发送到搜索引擎还是站点
 ### 开始导航

brower/overview.md

@@ -0,0 +1,29 @@
+---
+layout: doc
+outline: deep
+---
+## LCP(Largest Contentful Paint)
+
+LCP 会报告视口中可见的最大图片或文本块的呈现时间
+
+对于视频会判断封面时间和第一帧呈现时间中较短的为准
+
+## CLS(Cumulative Layout Shift)
+衡量页面整个生命周期中不符合预期的布局偏移
+
+## INP(Interaction to Next Paint)
+评估网页对用户互动的总体响应情况。最终 INP 值是观测到的最长互动时间
+
+## TTFB(加载第一个字节所需时间)
+用于衡量从请求资源到响应的第一个字节开始到达的时间点之间的时长
+
+## FCP(First Contentful Paint)
+衡量从用户首次导航到网页到网页内容的任何部分在屏幕上呈现的时间
+
+## TBT(Total Blocking Time) 
+衡量在 First Contentful Paint (FCP) 之后主线程被阻塞的时间足以阻止输入响应的总时间
+
+主线程“阻塞”因为浏览器无法中断正在进行的任务。因此，如果用户在长时间运行的任务过程中与页面交互，浏览器必须等待任务完成后才能响应。
+
+如果任务时间足够长（超过 50 毫秒），用户很可能会注意到延迟，并认为网页运行缓慢或已损坏。
+