leeandmins的博客

Web前端很多优化原则都是从如何提升网络通讯效率的角度提出的，但是这些原则使用的时候还是有很多陷阱在里面，如果我们不能深入理解这些优化原则背后所隐藏的技术原理，很有可能掉进这些陷阱里，最终没有达到最佳的预期效果，今天我在这里分析下浏览器和服务端通讯的一些细节问题，希望通过分析这些细节问题，能给大家一个启迪，能更好的理解这些优化原则背后的隐秘，最终能更好的运用这些原则。　　网站的通讯技术是构

在开始本篇主要内容前，我们一起看看下面的几张截图，首先是第一张图，如下图所示： 　　这是一家电商网站的首页，当我们第一次打开这个首页，网站会弹出一个强制性的对话框，让用户选择货物配送的地址，如果是淘宝和京东的话，那么这个选择配货地址的选项是在商品里，如下图是淘宝的选择配送地点： 　　下图是京东选择配货地点： 　　那么图一跟京东和淘宝有什么区别呢？图一

在存储瓶颈的开篇我提到像hao123这样的导航网站只要它部署的web服务器数量足够，它可以承载超大规模的并发访问量，如果是一个动态的网站，特别是使用到了数据库的网站是很难做到通过增加web服务器数量的方式来有效的增加网站并发访问能力的。但是现实情况是像淘宝、京东这样的大型动态网站在承担高并发的情况下任然能保证快速的响应，这其中有什么样的技术手段可以达到动态网站支撑高并发的场景了，这也许是每个做we

上篇文章我简要的介绍了下网站静态化的演进过程，有朋友可能认为这些知识有点过于稀松平常了，而且网站静态化的技术基点也不是那么高深和难以理解，因此它和时下日新月异的web前端技术相比，就显得不伦不类了。其实当我打算写本系列的之前我个人觉得web前端有一个点是很多人都知道重要，但是有常常低估它作用的，那就是web前端和web服务端如何融合的这个点上，这个点再加上我们要做出一个规模庞大，高并发，快速响应的

前文里我讲到了网站静态化的关键点是动静分离，动静分离是让动态网站里的动态网页根据一定规则把不变的资源和经常变的资源区分开来，动静资源做好了拆分以后，我们就可以根据静态资源的特点将其做缓存操作，这就是网站静态化处理的核心思路。由此可见，网站静态化处理的核心就是动静分离和缓存两大方面，上篇我简单讲述了动静整合的基础知识，本篇将会讲述两大核心之一的动静分离策略，只有把动静分离策略做好了，缓存才能发挥出它

上篇我补充了下SSI的知识，SSI是一个十分常见的技术，记得多年前我看到很多门户网站页面的后缀是.shtml，那么这就说明很多门户网站都曾经使用过SSI技术，其实现在搜狐网站也还在用shtml，如下图所示： 　　由此可见SSI在互联网的应用还是非常广泛的。其实互联网很多网页如果我们按照动静分离策略拆分，绝大部分都是可以当做静态资源处理，例如新闻网站，文学网站，这些网页生成后，大部分

讲完了SSI，ESI，下面就要讲讲CSI了 ，CSI是浏览器端的动静整合方案，当我文章发表后有朋友就问我，CSI技术是不是就是通过ajax来加载数据啊，我当时的回答只是说你的理解有点片面，那么到底什么是CSI技术了？这个其实要和动静资源整合的角度来定义。　　CSI技术其实是在页面进行动静分离后，将页面加载分为两个步骤完成，第一步是加载静态资源，静态资源加载完毕后进行第二步骤加载动态资源。不

前文讲到了CSI技术，这就说明网站静态化技术的讲述已经推进到了浏览器端了即真正到了web前端的范畴了，而时下web前端技术的前沿之一就是前后端分离技术了，那么在这里网站静态化技术和前后端分离技术产生了交集，所以今天我将讨论下前后端分离技术，前后端分离技术讨论完后，下一篇文章我将会以网站静态化技术的角度回过头来重新审视下前后端分离技术，希望通过这种审视来加深我们对两套技术的理解。　　前后端分

我第一次听说nodejs技术大概是在2009年年末，不过我真正认真在网络上进一步了解nodejs还是在2010年年中，当时对nodejs的认识和我现在对nodejs的认识有着天壤的区别，开始想了解nodejs我只是为了感慨谷歌公司开发的V8引擎居然如此强大，它不仅仅可以作为chrome浏览器的javascript内核运行平台，居然还能为服务端使用javascript语言作为平台，通过对nodejs

前后端分离的主题虽然讲完了，但是前后端分离的内容并没有结束，本篇将继续前后端分离的问题，只不过这次前后端分离的讲述将会围绕着本系列的主题网站静态化进行。在讲本篇主题之前，我需要纠正一下前后端分离主题讲述中会让朋友们产生误导的地方，这种误导就是对时下流行的一些前后端分离方案（没有使用nodejs的前后端分离方案）的评价问题，其实本人任然觉得不管什么样的前后端分离方案只要成功被实施，并且产生了良好的效

本文开篇提个问题给大家，关系数据库的瓶颈有哪些？我想有些朋友看到这个问题肯定会说出自己平时开发中碰到了一个跟数据库有关的什么什么问题，然后如何解决的等等，这样的答案没问题，但是却没有代表性，如果出现了一个新的存储瓶颈问题，你在那个场景的处理经验可以套用在这个新问题上吗？这个真的很难说。　　其实不管什么样的问题场景最后解决它都要落实到数据库的话，那么这个问题场景一定是击中了数据库的某个痛点，

存储的瓶颈写到现在就要进入到深水区了，如果我们所做的网站已经到了做数据库垂直拆分和水平拆分的阶段，那么此时我们所面临的技术难度的挑战也会大大增强。　　这里我们先回顾下数据库的垂直拆分和水平拆分的定义：　　垂直拆分：把一个数据库中不同业务单元的数据分到不同的数据库里。　　水平拆分：是根据一定的规则把同一业务单元的数据拆分到多个数据库里。　　垂直拆分是一个粗粒度的拆分数

本篇继续web前端优化的讨论，开始我先讲个我所知道的一个故事，有家大型的企业顺应时代发展的潮流开始投身于互联网行业了，它们为此专门设立了一个事业部，不过该企业把这个事业部里的人事成本，系统运维成本特别是硬件采购的成本都由总公司来承担，当然互联网业务上的市场营销成本这块还是由该事业部自己承担，可是网站一年运维下来，该公司发现该事业部里最大的成本居然不是市场营销的开销，而是短信业务和宽带使用上的开销，

本文介绍了 HTML5 WebSocket 的由来，运作机制及客户端和服务端的 API 实现，重点介绍服务端（基于 Tomcat7）及客户端（基于浏览器原生 HTML5 API）实现的详细步骤；并通过实际客户案例描述了客户端如何在 WebSocket 架构下使用 HTTP 长连接与服务器实现实时通信及消息推送的功能，读者通过阅读本文中案例示例代码的实现，能够更深刻理解 WebSocket 框架的技

503错误　　在上篇，我讲到某些网站在高并发下会报出503错误，503错误的含义是指网站服务端暂时无法提供服务，503还表达了网站服务端现在有问题，但是以后可能会提供正常的服务，对http协议熟悉的人都知道，5开头的响应码表达了服务端出现了问题，在我们开发测试时候最为常见的是500错误，500代表的含义是服务端程序出现了错误导致网站无法正常提供服务，500通常是服务端异常和错误所致，如果生

上文里我遗留了两个问题，一个问题是数据库做了水平拆分以后，如果我们对主键的设计采取一种均匀分布的策略，那么它对于被水平拆分出的表后续的查询操作将有何种影响，第二个问题就是水平拆分的扩容问题。这两个问题在深入下去，本系列就越来越技术化了，可能最终很多朋友读完后还是没有找到解决实际问题的启迪，而且我觉得这些问题都是像BAT这样巨型互联网公司才会认真思考的，因此本篇我打算换个角度来阐述本文的后续内容。

在讲数据库水平拆分时候，我列出了水平拆分数据库需要解决的两个难题，它们分别是主键的设计问题和单表查询的问题，主键问题前文已经做了比较详细的讲述了，但是第二个问题我没有讲述，今天我将会讲讲如何解决数据表被垂直拆分后的单表查询问题。　　要解决数据表被水平拆分后的单表查询问题，我们首先要回到问题的源头，我们为什么需要将数据库的表进行水平拆分。下面我们来推导下我们最终下定决心做水平拆分表的演进过程

上篇里我讲到了一种前后端分离方案，这套方案放到服务端开发人员面前比放在web前端开发人员面前或许得到的掌声会更多，我想很多资深前端工程师看到这样的技术方案可能会有种说不出来的矛盾心情，当我的工作逐渐走向越来越专业化的前端开发后，我就时常被这套前后端分离方案所困惑，最近我终于明白了这个困惑的本源在哪里了，那就是这套前后端分离方案其实是服务端驱动的前后端分离方案，它的实现手段又是从服务端的MVC架构体

反向代理也是一种可以帮助实现网站静态化的重要技术，今天我就来讲讲反向代理这个主题。那么首先我们要了解下什么是反向代理。和反向代理相对应的是正向代理，正向代理也就是我们常说的代理服务，正向代理是非常常见的，例如在某些公司里我们想使用互联网，那么我们就得在浏览器里设置一个代理服务器，通过代理服务器我们才能正常使用互联网，而这个代理服务器就是一个正向代理服务器。正向代理更加让人熟悉的使用场景估计还是在F

互联网上有很多关于网站架构的各种分享，有些主要是从运维和基础架构的角度去分析的（堆机器，做集群），太关注技术细节实现，普通的开发人员基本看不太懂。　　本文上篇将主要介绍大型网站基础架构的扩展，下篇则重点从应用程序的角度去介绍网站架构的扩展和演变。　上篇　　草根时期，快速开发网站并上线。当然，通常只是先试水，用户规模也没有形成，经济能力和投入也非常有限。　　有

前不久公司请来了位互联网界的技术大牛跟我们做了一次大型网站架构的培训，两天12个小时信息量非常大，知识的广度和难度也非常大，培训完后我很难完整理出全部听到的知识，今天我换了个思路是回味这次培训，这个思路就是通过本人目前的经验和技术水平来思考下大型网站技术演进的过程。　　大型网站定义　　首先我们要思考一个问题，什么样的网站才是大型网站，从网站的技术指标角度考虑这个问题人们很容易犯一个

网站静态化处理这个系列马上就要结束了，今天我要讲讲本系列最后一个重要的主题web前端优化。在开始谈论本主题之前，我想问大家一个问题，网站静态化处理技术到底是应该归属于web服务端的技术范畴还是应该归属于web前端的技术范畴，要回答清楚这个问题我们要明确下网站应用的本质到底是什么？网站的本质其实就是BS，这里的BS我没有带上架构二字，而就是指Browser和Server即浏览器和服务器，而网站静态化