浏览器从输查找缓存合成 URL浏览区会判断用户输入是否为合法 URL（Uniform Resource Locator,统一资源定位器）。如果用户输入的是搜索关键词，默认的搜索引擎会合成新的 URL。如果符合 URL 规则，会根据 URL 协议，在这段内容加上协议合成合法的 URL。
查找缓存网络进程获取到 URL，先去本地缓存中查找是否有缓存资源，如果有则拦截请求，直接将缓存资源返回给浏览器进程；否则，进入网络请求阶段。
DNS 解析（域名系统 Domain Name System）DNS 查找数据缓存服务中是否缓存过当前域名信息，有则直接返回；否则，会进行 DNS 解析返回域名对应的 IP 和端口号，如果没有指定端口号，http 默认 80 端口，https 默认 443。如果是 https 请求，还需要建立 TLS 连接（传输层安全性协议 Transport Layer Security）。
TCP 连接建立 TCP 连接：TCP 三次握手与服务器建立连接，然后进行数据的传输；
发送 HTTP 请求：浏览器首先会向服务器发送请求行，它包含了请求方法、请求 URI（统一资源标识符 ...
什么是 PRDPRD（Product Requirement Document，产品需求文档）是用于描述产品需求和特性的文件。它通常由产品经理编写，用于指导开发团队理解和实现产品。PRD 包含产品的目标、功能需求、用户故事、技术要求等信息，是产品开发过程中的重要文档。
怎么写 PRD编写 PRD 的步骤如下：
1. 简介
项目名称：项目的名称
项目背景：简要描述项目背景和目标
项目负责人：列出相关人员及其职责
2. 目标和目标用户
项目目标：描述产品的核心目标和预期效果
目标用户：定义产品的主要用户群体及其需求
3. 功能需求
核心功能：列出产品的核心功能模块
详细功能说明：对每个功能模块进行详细描述，包括功能的具体需求、用户交互流程、界面设计等
4. 用户故事
用户故事：从用户的角度描述他们在使用产品时的场景和需求，每个用户故事应包括用户类型、需求、操作步骤及预期结果
5. 技术需求
系统架构：描述产品的技术架构，包括前端、后端、数据库等
技术栈：列出使用的编程语言、框架、工具等
性能需求：包括响应时间、并发用户数、数据存储要求等
6. 非功能需求
安全性：描述产品的安全需 ...
1. 删除远程分支1git push origin --delete [branch_name]
2. 删除本地分支git branch -d 和 git branch -D 的区别
git branch -d: 会在删除前检查合并状态（与上游分支或者与 HEAD）。
git branch -D: 是 git branch --delete --force 的简写，直接删除分支。
共同点
都是删除本地分支的方法（与删除远程分支命令独立运行）。要想本地和远程分支都删除，必须分别运行两个命令。
3. 查看分支
查看本地分支:
1git branch
查看远程分支:
1git branch -r
查看本地和远程分支:
1git branch -a
4. 删除分支
删除本地分支:
1git branch -d 本地分支名
删除远程分支:
1git push origin --delete 远程分支名
推送空分支到远程（删除远程分支的另一种方法）:
1git push origin :远程分支名
JavaScript 中的解构赋值与拓展运算符 ... 的用法JavaScript 中的解构赋值和拓展运算符 ... 是 ES6 中引入的非常强大的特性，它们能够简化代码并提高可读性。下面分别介绍它们的用法。
解构赋值解构赋值可以从数组或对象中提取值，然后赋值给变量。
数组解构赋值12345678const array = [1, 2, 3];// 使用解构赋值从数组中提取值const [a, b, c] = array;console.log(a); // 1console.log(b); // 2console.log(c); // 3
对象解构赋值123456789101112const person = { name: "John", age: 30, city: "New York",};// 使用解构赋值从对象中提取值const { name, age, city } = person;console.log(name); // Johnconsole.log(age); // 30co ...
面试题
未读JavaScript 中的解构赋值与拓展运算符 ... 的用法JavaScript 中的解构赋值和拓展运算符 ... 是 ES6 中引入的非常强大的特性，它们能够简化代码并提高可读性。下面分别介绍它们的用法。
解构赋值解构赋值可以从数组或对象中提取值，然后赋值给变量。
数组解构赋值12345678const array = [1, 2, 3];// 使用解构赋值从数组中提取值const [a, b, c] = array;console.log(a); // 1console.log(b); // 2console.log(c); // 3
对象解构赋值123456789101112const person = { name: "John", age: 30, city: "New York",};// 使用解构赋值从对象中提取值const { name, age, city } = person;console.log(name); // Johnconsole.log(age); // 30co ...
面试题
未读Flex 布局Flex 布局是 CSS3 中的一种布局方式，它通过简化布局的实现过程，极大地增强了 CSS 布局的能力。使用 Flex 布局可以轻松地创建各种复杂的布局。
Flex 容器与项目
Flex 容器：设置了 display: flex 或 display: inline-flex 的元素。
Flex 项目：容器内部的子元素。
常见的 Flex 属性容器属性
display：指定为 Flex 容器。
123.container { display: flex;}
flex-direction：定义主轴方向。
123.container { flex-direction: row; /* 默认值，可以是row, row-reverse, column, column-reverse */}
justify-content：定义主轴上的对齐方式。
123.container { justify-content: center; /* 可以是flex-start, flex-end, center, space-betwe ...
面试题
未读Margin 设置为负数的理解在 CSS 布局中，margin属性用于创建元素周围的空间。当margin设置为负数时，它允许元素与其他元素重叠或超出其正常流的位置。以下是对于margin负值应用的理解：
margin上方负值
参考线：包含块(contenting block)内容区域的上边或上方相连元素margin的下边。
效果：元素会向上移动，与参考线的距离减少。
margin左方负值
参考线：包含块(contenting block)内容区域的左边或左方相连元素margin的右边。
效果：元素会向左移动，与参考线的距离减少。
margin下方负值
参考线：元素本身border的下边。
效果：参考线向上移动，但元素位置保持不变。
margin右方负值
参考线：元素本身border的右边。
效果：参考线向右移动，但元素位置保持不变。
双飞翼布局与圣杯布局对比
双飞翼布局实现方式：
使用一个包含三栏的容器，并在中间栏中嵌套一个子容器。
通过负外边距(negative margin)将左栏和右栏分别移动到正确的位置。
优点：
实现较为简单，逻辑清晰。
中间栏的内容首先加载，适 ...
面试题
未读什么是选择器，它们之间的优先级是什么样的？元素选择器123p { color: blue;}
选择所有 <p> 元素。
类选择器123.className { color: red;}
选择所有带有 class="className" 的元素。
ID 选择器123#idName { color: green;}
选择带有 id="idName" 的元素。
属性选择器123a[target="_blank"] { color: orange;}
选择所有 target 属性值为 _blank 的 <a> 元素。
后代选择器123div p { color: purple;}
选择所有位于 <div> 元素内的 <p> 元素。
子选择器123div > p { color: yellow;}
选择所有作为 <div> 元素直 ...
面试题
未读1. 什么是回流和重绘？它们和 BFC 有什么关系？回流（Reflow）回流是指当元素的尺寸、位置、或其他属性发生变化时，浏览器重新计算文档的布局（或几何结构）的过程。任何会影响元素几何属性的操作都会触发回流，例如：
页面一开始渲染时
添加或删除 DOM 元素
改变元素的尺寸、边距、填充或边框
改变元素的内容
改变页面的样式（例如改变display、position、float等属性）
调整浏览器窗口大小
回流是一个代价较高的操作，因为它不仅影响单个元素，还可能影响它的子元素、兄弟元素或父元素。因此，频繁的回流会对页面性能产生负面影响。
重绘（Repaint）重绘是指当元素的外观发生变化但不会影响布局时，浏览器重新绘制元素的过程。例如：
改变元素的背景颜色、文字颜色
改变元素的阴影效果
改变元素的可见性（例如visibility属性）
重绘的代价通常比回流要低，因为它只需要更新元素的外观，而不需要重新计算其布局。
BFC 与回流的关系回流（Reflow）是指浏览器重新计算元素几何属性（位置和大小）并重新布局的过程。回流会影响页面性能，尤其是当回流影响到大量元素时。
隔离性减少回 ...
Git 分支切换方法方法一：git checkout targetbranch
首先，获取远程所有分支1git fetch
查看所有远程分支，找到需要的远程分支，例如 origin/targetbranch1git branch -r
在本地新建一个同名分支，然后系统会自动与该远程分支关联1git checkout targetbranch
注意：git checkout origin/mybranch 会进入 detached head 状态，不会在本地新建分支，不要这样写。
方法二：git checkout -b 本地分支名 origin/远程分支名
首先，获取远程所有分支1git fetch
创建与远程分支关联的本地分支（可以同名，也可以不同名；建议同名，方便管理）1git checkout -b 本地分支名 origin/远程分支名
方法三：git checkout --track origin/远程分支名
首先，获取远程所有分支1git fetch
创建与远程分支关联的本地分支1git checkout --track origin/远程分支名
方法四：git c ...
