最新文章
CLAUDE 2周前
文章无缩略内容。
git-ssh-relationship-explained 2周前
文章无缩略内容。
github-connection-debug-china-mainland 2周前
文章无缩略内容。
k8s-statefulset-scaling-issues 2周前
文章无缩略内容。
scutil-macos-network-debug-tool 2周前
文章无缩略内容。
server-optimization-session-summary 2周前
文章无缩略内容。
优质独立博客收集 2周前
这里收集值得关注的优质技术独立博客，为技术学习和视野拓展提供参考。
css面试 2周前
如何理解 CSS 的盒子模型？ ✅ 现代CSS基础
每个 HTML 元素都是长方形盒子。
传统理解:
标准 W3C 盒模型包含：内容(content)、填充(padding)、边界(margin)、边框(border)。
现代最佳实践:
http 2周前
2 MIME type ，用于描述并标记 web 多媒体内容。
比如：html 格式文档由 text/html 标识，ASCII 文本由 text/plain 类型标识，gif ：image/gif ，jpeg 标识：image/jpeg
3 URL 统一资源定位符：方案+服务器地址+ 某个具体资源
http://www.joes-hardware.com/specials/saw-blade.gif
4 http 方法
常见样式 2周前
文章无缩略内容。
现代CSS升级指南 2周前
文章无缩略内容。
网页加载顺序 2周前
本文是HTML CSS JS的加载流程相关知识的笔记。
网页布局 2周前
使用
outline:1px solid red;轮廓绘制在元素框之上,不影响元素大小和定位，被用来 debug只有普通文档流中
块元素的垂直外边距才会发生外边距叠加。行内框，浮动框和绝对定位框之间的外边距不会叠加。inline元素在一行上水平排列，只能设置行高，水平边框，水平padding，水平margininline-block也可以在一行上水平排列， 并且可以设置width,height,margin,padding等
从上往下 可见内容为
网页文字 2周前
文章无缩略内容。
01-nodejs-tutorial 2周前
Node.js中的JavaScript
// Node.js环境
console.log('Hello'); // 没有window对象
process.version; // 有process全局对象
require('fs'); // 可以读写文件JS 2周前
文章无缩略内容。
OOP 2周前
JS不区分类和实例的概念，而是通过原型（prototype）来实现面向对象编程
原型是指当我们想要创建 xiaoming 这个具体的学生时，我们并没有一个 Student 类型可用。那怎么办？恰好有这么一个现成的对象：
async-await-tutorial 2周前
文章无缩略内容。
cookie-js 2周前
文章无缩略内容。
dom-essentials-for-modern-frontend 2周前
文章无缩略内容。
dom-event-programming-essentials 2周前
文章无缩略内容。
jquery 2周前
一个专业的操作DOM的库。
js-event-loop-complete-analysis 2周前
本文深度分析JavaScript的单线程执行机制、事件循环原理，以及浏览器和Node.js环境下的异步执行模型差异。
js-host-environment-objects 2周前
宿主环境提供的顶级对象（如 window、global、process）与标准 JavaScript 对象的继承关系分析。
js-modules-tutorial 2周前
文章无缩略内容。
js-object-prototype-analysis 2周前
Object 是 JavaScript 原型链的根源，几乎所有对象都直接或间接继承自 Object.prototype。
js-primitive-boxing-analysis 2周前
JavaScript 中有三种原始类型具有装箱机制：string、number 和 boolean。它们都采用相同的设计模式。
js-single-thread-event-loop-deep-dive 2周前
文章无缩略内容。
js-string-type-design 2周前
JavaScript 的 string 类型设计是一个非常巧妙的双重身份系统，它既是原始类型又能像对象一样使用方法。
js-this-deep-analysis 2周前
JavaScript 中的 this 关键字经历了从 ES5 的复杂难懂到 ES6+ 的优雅实用的重大演进。本文将深入探讨 this 的设计哲学、ES6+ 的革命性改进和现代最佳实践。
js函数进阶 2周前
文章无缩略内容。
js原型与继承 2周前
文章无缩略内容。
js原型与继承深度解析 2周前
文章无缩略内容。
js原型链继承图解 2周前
基于经典的 Person 和 Student 类原型链继承示例，深度图解 JavaScript 原型链机制。
js对象基础 2周前
文章无缩略内容。
js数据类型详解 2周前
文章无缩略内容。
promise-tutorial 2周前
文章无缩略内容。
上传文件 2周前
文章无缩略内容。
函数 2周前
普通 函数声明 会被前置
正则 2周前
直接给出字符，就是精确匹配
匹配符
Vue3运行时编译时混合架构深度分析 2周前
文章无缩略内容。
vue3-computed-deep-analysis 2周前
文章无缩略内容。
vue3-reactive-reassignment 2周前
文章无缩略内容。
声明式vs命令式编程性能分析 2周前
文章无缩略内容。
虚拟DOM与组件深度理解 2周前
学习时间: 2025-08-01
技术栈: Vue 3, 虚拟DOM, 组件系统
重要程度: ⭐⭐⭐⭐⭐ (核心理论基础)
web优化 2周前
动静分离
所谓的动静分离，就是将 Web 应用程序中静态和动态的内容分别放在不同的 Web 服务器上，有针对性的处理动态和静态内容，从而达到性能的提升。我们知道如果一个 HTML 有多个域名请求数据文件会提高
Tomcat 服务器在处理静态和并发问题上比较弱，所以事先动静分离的方式一般会用 Apache+Tomcat、Nginx+Tomcat 等。
以 Apache+Tomcat 为例，其运行机理是：页面请求首先给 Apache，然后 Apache 分析请求信息是静态还是动态，静态则本机处理，动态则交给 Tomcat 做处理这其实是负载均衡的雏形，这样的实现不用让开发人员做任何特殊开发，一个<img src="demo.jpg">交给服务器即可，至于这个文件是从 Apache 还是从 Tomcat 取得，开发人员完全无需关注。
HTTP 持久连接
持久连接（Keep-Alive）也叫做长连接，它是一种 TCP 的连接方式，连接会被浏览器和服务器所缓存，在下次连接同一服务器时，缓存的连接被重新使用。HTTP 无状态性表示了它不属于长连接，但 HTTP/1.1 提供了对长连接的支持（不过这必须依赖浏览器和服务器双方均支持长连接功能才行），最常见的 HTTP 长连接例子是“断点下载”。
浏览器在请求的头部添加 Connection:Keep-Alive，以此告诉服务器“我支持长连接，你支持的话就和我建立长连接吧”，而倘若服务器的确支持长连接，那么就在响应头部添加“Connection:Keep-Alive”，从而告诉浏览器“我的确也支持，那我们建立长连接吧”。服务器还可以通过 Keep-Alive:timeout=..., max=...的头部告诉浏览器长连接失效时间。
配置长连接通常是要服务器支持设置，有测试数据显示，使用长连接和不使用长连接的性能对比，对于 Tomcat 配置的 maxKeepAliveRequests 为 50 来说，效率竟然提升了将近 5 倍。
GZIP 压缩技术
HTTP协议支持GZIP的压缩格式，当服务器返回的HTML信息报头中包含Content-Encoding:gzip，它就告诉浏览器，这个响应的返回数据已经压缩成GZIP格式，浏览器获得数据后要进行解压缩操作，一定程度上减轻了服务器传输数据的压力。
很多服务器已经支持通过配置来自动将HTML信息压缩成GZIP，比如tomcat、又比如很火的Nginx。如果无法配置服务器级别的GZIP压缩机制，可以改为程序压缩。
HTTP 协议的合理使用
浏览器缓存带来的性能提升已经众人皆知了，而很多人却并不知道浏览器的缓存过期时间、缓存删除、什么页面可以缓存等，都可以由我们程序员来控制，只要您熟悉 HTTP 协议，就可以轻松的控制浏览器。
扩展阅读：深入理解 HTTP 协议
CDN 机制
所谓的CDN，就是一种内容分发网络，它采用智能路由和流量管理技术，及时发现能够给访问者提供最快响应的加速节点，并将访问者的请求导向到该加速节点，由该加速节点提供内容服务。
通俗点说，你在成都（浏览器）购买了北京卖家（服务器）的产品，北京卖家通过快递（CDN服务）寄送包裹，从北京到成都可以走路、坐汽车、火车或飞机，而采用CND的快递会选择飞机直达，因为这种寄送方式最快。
当然使用 CDN 有两个注意事项：
1、CDN 加速服务很贵，如果你觉得你的网站值得加速，可以选择购买；
2、CDN 不适合局域性网站，比如你的网站只有某一个片区访问或者局域网访问，因为区域性网络本来就很近，无需 CDN 加速。
懒加载与预加载
预加载和懒加载，是一种改善用户体验的策略，它实际上并不能提高程序性能，但是却可以明显改善用户体验或减轻服务器压力。
预加载表示当前用户在请求到需要的数据之后，页面自动预加载下一次用户可能要看的数据，这样用户下一次操作的时候就立刻呈现，依次类推。
懒加载表示用户请求什么再显示什么，如果一个请求要响应的时间非常长，就不推荐懒加载。
渐进式增强设计
渐进式增强设计的通俗解释就是：首先写一段满足所有浏览器的基本样式，再在后面针对不同高级浏览器编写更漂亮的样式
如下代码，所有浏览器都支持background-color: #2067f5;满足了浏览器基本现实需求，而后面的background-image: -webkit-gradient等则为不同高级浏览器使用，只要浏览器识别就能执行这段代码（不识别，CSS也不会报错只会直接忽略）。
避免空链接属性
微信小程序开发实战总结 2周前
文章无缩略内容。