最近看到许多人在头痛pop 的点损问题，我想下面的这篇文章会很合适你，在我手机里面保存了很长时间7 V: U9 u: D2 E) i: ?$ ~3 i 虽然说的情况适用于国内，但是思路适用于全球, ?4 a q4 @ H2 h- T 1 x, Y1 `. e/ m$ W5 f2 g. f $ P4 i! r9 L+ p9 C& f3 ~$ _# k( p * u) I8 T; o# t( W; i + U! ^" ]0 F- h% b ) n6 b. k/ T3 O 不知道从什么时候开始，不管是写独立博客，还是网络应用，甚至写托管博客的人都会朝着“大”网站看齐，去追求网站的响应速度，通俗点说，就是白屏时间，因为据各种报告说，网站打开速度更快一些，带来的用户体验就更好一些，从而带来更多的附加利益。但是对于用户来说，快，并不是简简单单请求数目尽可能少，和服务器吞吐能力尽可能大。那么，怎么快？# | N* d3 ^: h+ y* D ' v5 H" |# b4 ~# F' A : s; [7 w4 X9 h! J- M - s+ o4 Z* Q: [ ~2 S: ? ! ] v, [+ I$ p+ D+ _2 ~ 8 N# D; S' T6 O' R2 Z 服务器机器性能 服务器机房带宽资源 服务器软件性能 DNS查询速度 页面资源压缩（服务端+客户端） 页面提供资源数量 页面资源加载时机 用户终端某时刻性能 用户终端浏览器性能 用户直观感受 [附加]异常流量情况5 l; c/ J- k# J0 J; s! K C: w, ~ 0 b- _5 h2 j" o. Q a+ [ ! i/ g! D D5 Y1 ]1 f* X& f 如果有兴趣，不妨和我一起逐一聊聊吧：5 z8 {! L0 [+ E- {$ `2 O- J ! [# k8 P; Z$ P! c0 Z / z8 D' \( x2 M, C# Q. \( w9 P 服务器性能 0 t/ B( M( v2 K- a `4 `/ o# r. [ 1 \* U8 T5 X7 c8 B8 ? ; P; L' ?3 o+ @/ c1 `+ Z $ C8 c4 T+ q) v+ V8 p# P$ @ 就博客/网站主来说，我们应该使用尽可能更好的资源，但是非土豪的话，资源好到什么程度呢，答曰：够用。* j& |$ @# g/ O; G% `& N' C 4 I3 A; d9 h6 b5 w 7 P0 `4 z5 b4 y1 s% z % }$ `0 R9 |" i' T 这个“有余力”是你对网站/应用的访问量有评估后，并进行压测，观察机器负载得到的。& k( \+ U! m& X$ S2 g0 l* N H $ T8 A1 R( |# ?8 q! a0 p1 u 如果你的网站有大量文件IO/数据库读写操作，那么为了保证最佳性能，不妨尝试使用SSD，或者进行内存缓存等操作，一旦你使用内存缓存，那么整体的性能瓶颈多数情况下会从机器整体性能变为网卡/带宽，是不是可喜可贺。4 N, ?8 S4 a& x! C/ ~9 q) G4 K) R8 h & s/ Y% C8 H+ _0 M$ z/ k# J/ U 4 r4 X$ ]. z+ @& Z7 i; m ?7 Z2 J # n A) B0 x) Y6 z8 c5 Q9 s 说到压测，不得不继续说下面的话题了。, R, L) ]8 l" M2 t8 A, x$ I 7 ?- ^3 Q# T/ R$ i0 z 机房带宽资源 : w0 B2 E) c/ K. ~1 u " Z$ c7 q% _6 O1 x3 z( y B 带宽资源或许是除了高端存储设备外，价格最贵的资源之一了。所以，评估带宽是否满足你的站点，是特别重要的事情。+ L% `; _4 }# Z( [) V5 N # Z0 v8 n4 ?% v; ~$ t" ` 一般来说小站点，1~2M的带宽绝对够用。如果不知道你的机器的带宽能力，不妨登录机器后台观察流量图峰值，或者机器安装speedtest-cli，来进行数据收集。( Q6 K a, y6 S9 U4 d5 m - [% U% ~; c! }7 Y$ b Q% B: W' R 诸如我用过的机器，突发状况下能力为：4 Z* W) a! }; o1 k7 K0 ^ 7 c) [' ?8 N l# F) R ( l) v7 h' j% V, n- C Linode 测速: {; D& P6 J1 G/ w7 ?$ N/ [4 ` Testing from Linode(X.X.X.X)... Selecting best server based on latency... Hosted byT-Mobile(West Norriton,PA)[104.63km]:79.475ms Testing download speed........................................ Download:53.68Mbits/s Testing upload speed.................................................. Upload:32.51Mbits/s * H) }) @) V8 {( h+ a9 L' x $ y4 U" l' I( c/ x! y , u0 M; A& U/ A / M- o+ y( H6 f# U* N0 I HK 机房测速, N( U1 T% x8 O f; q5 J" g Testing from HK DataCenter(X.X.X.X)... Selecting best server based on latency... Hosted by FPT Telecom(Hong Kong)[5.98km]:28.453ms Testing download speed........................................ Download:77.30Mbits/s Testing upload speed.................................................. Upload:4.45Mbits/s# `( |: S, X: W5 n : I2 m) g, f* `0 S0 j: P & W1 ~/ p2 E B* v) I8 ~9 A- F " E& e( g% O( \" ~ ~# t: {8 a ; U& _" N$ }* H ; T" V% r" H7 a9 B* I , R3 B; V% m( j! [3 j j 但是，综合现实因素，诸如政策和地理位置的原因，网站响应速度和机房有重大关系，比如，BGP机房线路智能负载后的响应时间可以达到10ms甚至以下，或者你可以尝试ping一下自己的本地服务器，响应时间感人，但是在祖国大地，如果你直接访问一些美帝国或者欧洲大陆机房则可能速度会增大几十到几百倍，甚至出现访问不能的状况。: w2 c8 V2 z1 \. ~: ]! m 8 ]) s& Y, Q) }# @- T % T& `# W- c1 C: ^ d7 ]" ^; g# A / @4 x$ T) Y# o" d% s* V8 o 国内无所谓，自己能访问就好，国外快快的： 美帝机房/加拿大机房/日本机房/韩国机房/欧洲机房 国内国外速度相对快的机房 港澳台机房/日本机房/韩国机房/欧洲机房 国内快速，国外可能访问不了的机房 各省市机房/学校机房/港澳台机房# y0 q3 I* {7 B" g ( J; ]% ? H5 D * f R: T/ ^; a( g 5 ?& p7 ^* \* W! I 4 @% V: ]. m$ }+ ] 国内机房+国内外CDN 国外机房+国内外CDN8 p9 \( a6 }! I 2 d' @7 E/ \6 e% t3 M . F, t) F3 ^& m- b 当然，如果你和我的网站一样，是一个自己的无事写几笔的小站，那么选择国内的阿里云，或者香港机房都是不错的选择。; h( Q1 N% {; _0 ]2 z5 @4 h * i$ [$ \/ P& x9 E# ]4 \ 硬件说完了，我们聊聊第一节中提到的软件。5 n, L- U; I0 L7 k & p6 u6 o5 d+ g' A: |6 n! U- g 服务器软件性能 0 ]! J" {3 d1 F3 A$ n- m * d7 N6 M, K3 q; }$ Q 4 V; [1 M7 u7 }" [- x: V: T + @" z! S2 h U) L6 }7 M. K5 c8 D 如果你以前使用apache，且没有使用一些三方模块，或者不需要使用apache软件套装里的高级功能，或者没有软件必须依赖apache，以及三方模块能在nginx中找到替代的，可以考虑替换为nginx。 如果你的程序允许实现数据库缓存/站点内容缓存，但是没有使用缓存的，请开启缓存功能。 如果你的程序使用了文件缓存，在内存资源有富裕的情况下，请使用内存缓存（自己考虑缓存策略）。 如果你的程序原来的运行环境执行速度不够快，那么请考虑升级或运行环境，诸如php5.2->php.5.6+，或者php5.6->hhvm 3.x，asp/php->nodejs。 如果你的程序中多数功能你用不到，考虑使用更轻便的小程序。 如果你启用了缓存，且数据库（关系数据库）读取热数据频率高于冷数据，且访问量不是特别大，不需要考虑数据库效率，否则需要考虑数据库进行分库分表和建立适当的索引，以提高数据库吞吐能力。 根据自己情况适当调整nginx/mysql/redis/memcache等软件的数据分块大小。 优化程序关键逻辑的流程，尽可能让程序始终遵循最短路径结束任务。 尽可能让TCP链接重用，或者适当调整持久链接的时间和数量（Keep-Alive），以及考虑使用SPDY。 防火墙/服务器代理软件/程序对访客限制流量。 过滤或者禁止能力范围内的异常流量。# M! [5 k S' Q7 E9 \ s 9 J- w+ h2 _* L ) @, o! s2 u# o! h: u DNS查询速度 ! O2 c& I3 ~% `- P) T 1 Q+ W' o- i: A- N2 ?1 v& o DNS对于站点首次打开速度至关重要，所以请尽可能选择靠谱的DNS提供商来解决DNS查询问题。3 T8 `/ t8 g- a& Q; u; ?/ [ 7 t: Q" ?9 a, T# K- W' e& {5 O! S $ R; D" c5 v2 ]" l* p _ % w7 G, Y0 W- F! a: O- \ DNSPOD DNSLA: m/ t8 Y% k0 m+ ?7 Y8 U0 S$ [ z9 d- _5 {" i 4 o$ q/ g$ P8 \ g , d4 i: k9 ]6 M, i7 V4 |; q 2 o' @9 g$ G8 f' [ 0 R3 ]% L- Z$ D l/ ^ ] @ # F( ^- a I, P. d" | * N! Y c( _9 @" T <link rel="dns-prefetch"href="//7u2j6a.com1.z0.glb.clouddn.com"> <link rel="dns-prefetch"href="//7u2mwv.com1.z0.glb.clouddn.com">6 F- K; G1 B- a, X 3 G' o4 _# b( I& R8 ^8 ~( c) z/ { , D0 T% d E# f1 o8 f f 但是是否分离域名，请根据自己情况来。因为分离域名之后，不可否认的是，会带来额外的查询操作（查询本地缓存也算）。但是分离资源，可以使得程序更容易维护，以及对于程序整体安全性带来提高。- j9 N) G' _! v- N9 x( z. y w! ^) ] . z- q" M8 T, v' ^9 ^$ h+ L/ z 解释一下最后一句话，当初还在新浪的时候，翻看现在已然是大boss的ppt，其中提过这么一句话“执行不可写，可写不执行”。如果你的目录允许上传，那么上传目录的文件一定要限定不可执行，以及可以执行的目录，不可以进行写入操作，以免网页木马的上传，提高系统安全性。1 V5 x3 M, n) j$ C* u ; |# ?- d+ R; b5 W1 n% ]+ A9 M$ @ 另外，如果你将网站数据分离，那么网站的迁移操作，将会变的十分简单。比如，我将网站在国内国外迁移了若干次，只是需要先同步附件和页面资源域名，然后改变这两个域名的指向，然后同步程序文件，改版域名指向即可。0 R' ]9 f0 y3 L + o" L. f- i) E2 Z% Z & F# F$ F6 J3 Z; W' }1 H9 z 1 M" w, Y& g1 M2 @" o. K 页面资源压缩（服务端+客户端） - P& s" G% m* V. ~ ; k* w5 I" B+ R: i7 v 提到压缩，正常用户会想到的是rar/zip/7z，媒体爱好者想到的会是ABR/CBR/VBR/H.264，我们这类代码爱好者恐怕是gzip，如果你也是前端，可能你还会想到js compressor。6 a B- A5 ~; s8 D7 [ 6 q% G2 }' v* k2 _, | 服务器根据CPU能力，尽可能输出gzip后的资源。. K& n% O% Z1 z/ F; p % R: w M9 f2 x5 j! O; ]4 Q$ i1 r! U $ u4 u+ M" L5 Y5 S, A' ^3 W 为什么是尽可能输出gzip呢，因为可能你的页面需要支持古老手机端浏览器，一些古老的MID或者性能不太好的MID设备，或者是古老的IE6？如果不需要，那么请一律输出GZIP后的页面。1 \/ }; O, W O: ]6 n2 b ; n2 B" Q6 S9 y) [$ R1 d! z5 F. M4 h 替换或者提高压缩算法和策略。( S) k9 K! c* d! F6 a+ i; J " G3 [4 ~! p" r( A6 W& G ; t2 R- U8 Z/ L) T; ^ ( P6 v: l- R2 j! |& ?. t5 ^ # N9 }$ ~4 X$ K1 v- \5 [ v 对静态资源内容适当排序。$ M, j; U$ \; |" S' D+ z# y ( H. {: L) ~7 L3 h/ H; P ) B9 ]! k4 b2 ~7 b4 q. _( z : f+ n% G5 G* I1 v2 r/ s 9 A; m# t, M! `$ U4 Y* n3 ?0 s 适当添加页面额外内容，提高压缩比。6 R. l! L! x5 h2 D 3 N/ z! D3 l. b5 H. o; W5 x% I7 P % a- q, n3 R |* ~" b 9 L! ]( _2 h1 l1 j7 l+ e9 }; A a ! @; b: I+ f& K! f6 d7 _, { 使用脚本去掉多余的空格和换行。$ {, o; \! N$ Z9 P - ^! P% k' W, B0 O5 X 0 H+ P8 H n8 j7 L$ S $ r2 C# S; d; [ 3 e: G' w% O; x 使用缩略图/响应式图片来替代页面中展示的原始图片。3 Q- w/ f1 ^( I9 L0 f* ~- q, {* v5 ` + _- C1 z+ u! ^/ t% [4 L5 ]' E : ~$ p+ T5 |3 L* `1 b' M/ A) [; `, ^ 传统模式下，我们可以使用服务端脚本thumb类库/CDN提供的图片缩略服务来进行资源的缩略图，来替换原始图片，并增加一些交互文本，对用户实现降级访问。如果用户浏览器支持CSS3，那么我们可以使用Media Queries特性来对内容图片进行切换。如果用户浏览器支持HTML5，我们可以使用image-set标签来进行图片响应式输出。$ d7 B8 i: i. N3 X , S9 ^. n* n# ?7 X& @* \' ~ 接下来我们来说说另外一种变相的数据压缩，减少请求。, c' V# }% J" } : }9 k0 ~ K3 G! S1 W D( N* q 页面提供资源数量 - W# i7 Y. e" U % S" ]3 b Q4 j 尽可能减少同一时间的资源请求数量。4 y V* w# v! H' t" p- | 0 I& G# K3 u3 p6 W# j& ~8 t, r( W 6 E' v% V: X$ u t6 o A 对于静态样式和脚本，使用合并策略。针对单页面程序，你可以将所有样式或者脚本都合并为一个单独的文件。但是针对多页面，以及带有皮肤策略的站点，则考虑抽象基础的Base内容和额外的内容，并通过前后端脚本进行策略加载。对于图片和视频资源，在交互允许的情况下，使用延时加载，跨屏预加载一定数量，来取代页面文档加载完成后就加载全部的策略。$ }. v4 c$ I1 _0 L & Q# `; Z2 X2 [$ g# X% X* a/ d- C* A 对不同浏览器使用不同的脚本。; J7 D& j2 J( v8 _7 O , v6 }: ?( Z0 Y& r* i* o+ n ; ?( [ {" h. v. q: R( ^7 ? ' h& w: s; S9 m5 _& Q , T- z; m/ W* x+ w1 Y+ w1 \5 d$ q 页面增量更新。1 Z' J& x& X' G. R" M . d( F0 a# T9 F! g" Z/ S , A$ m* G" T0 Q. N% z 如果你的内容支持异步增量更新，那么使用接口更新增量内容的模式，来替换打开新页面的模式。曾几何时，这个被称作ajax页面局部刷新。" I" h$ M. _, m: ?/ | # f1 M* w" S6 C+ R: n 客户端缓存- N, w% C, @. [/ h; W( g B 3 h# O5 \/ o# s# ?$ D / p) I9 @; J' s. ` 9 ~* P# p. F& H/ E1 W: {) M. n, q. d9 w 7 n% N) C2 R3 C- \; c 客户端本地缓存。* J }. ]+ x2 O( H1 L1 D1 } 3 v) K' p/ n# |; u# p U & n4 K7 L; F0 S. T1 P. \ 3 _* A# E+ r9 U" E 5 _1 k8 r& Y. n3 H 上面提到的内容，多数属于道，现在我们来聊聊术。3 G6 l) \; `. m G; y$ n) m# a* V$ S* ~ 页面资源加载时机 + q/ R+ P2 c' E6 M/ `- n 8 G1 X: s7 E$ y( y( E! K8 T# u$ x , Z8 ^# q5 G; m; M ) Z1 i% X- G) O% g* e/ F 把css放在文档顶部。 把js放在文档底部。 减少inline脚本的存在。4 [$ U7 k* r. f; ^' |$ q ; V. x9 Z& ~0 T : i1 N- x3 o# Q' I, O* c& d( I) W 这里或许应该为：+ `5 v3 E1 v4 c8 Y6 e 2 g8 {2 V+ X1 c, Z- `# [* t 将页面主要样式尽可能放在文档顶部。 将三方不可合并脚本尽可能放置页面底部。 将页面inline脚本尽可能替换为配置内容。; q0 z+ A3 k) [ + c2 `0 I9 H& U& C) @& X: D ' ^& A' a* o: g 将基础样式放置于文档顶部，可以让页面渲染基础内容更快，如果前几点你都做到了，或者做到大多数，项目复杂度不高的话，那么把所有的样式打包合并放在此处也无关系。! M P: O6 D& F9 ~, d $ g: _- z* x0 l/ W6 h 9 o# s2 `$ ]( r& u' J* x: ] # N3 M! A1 C* O3 t" o0 n 做到如此，页面将会首屏渲染极快，以及页面卡顿大幅减少（大量动画情况另说）。3 C0 _4 ], g8 K, v9 u ' z. i. F% Z2 T" d- ?6 i6 w2 O 用户终端某时刻性能 ! k# @6 J! R; X+ S& T ' w: C J J9 t4 ]' p: i) j 这个不是我们所能控制的，因为受限于客户端宿主机性能以宿主机网络环境。和最开始提到的服务器性能一样，CPU时间片被其他程序占用时，或者硬件古老，以及网络被其他程序占用的时候，会带来浏览的不畅。( v& `- C" W5 b9 { ] ; l0 G% u- o s5 B: K% H 3 l" H$ i* {( x- } 7 ~6 F9 M6 n& {( n4 e# K 页面加载过慢，不妨检查网络环境是否有其他软件占用（下载工具/在线视频），并刷新页面。 资源加载失败，请刷新重试。0 \& U3 T' g4 v4 m5 M0 \ v4 D 8 S% x6 j1 Z4 @+ p - q* X( P1 [, o# C9 _ 6 e- j) d% |5 \# J" Z+ Q' s 5 C( P: m) d1 q% Y5 I( D 用户终端浏览器性能 ! U( I$ M4 k* Z, c5 l4 p ) E. z6 ~; h8 w' A% k2 X 如果你的用户使用者古老的浏览器，软件性能成为页面数据下载和渲染瓶颈，那么不妨给其一个提示，或者强制其使用新版本的浏览器进行访问：$ L& h" T( v4 O% q, @" O5 B 0 l; Y: E9 B4 D* ^1 C# X3 C 请更新浏览器以获得更加体验。 本站仅支持新的浏览器：A,B,C。 为了您的访问速度和安全考虑，我们推荐您安装：X,Y,Z。 您是不是打开太多页面了，请考虑关闭无用的页面，加快本页面打开速度（这招请考虑道德问题）。; G) e7 h7 Z3 a & y7 g9 o2 ^ f& |/ q9 K $ {. _+ }! {. C" p* L8 ] + o, k+ V" |' n9 c. T: K9 g* D 3 p2 L* T' r8 C' T 用户直观感受 8 @1 P/ G' f& m) W1 P. ~ ; M6 C. ?- ~) p& t 终于写到这里了，本节内容，其实上面的小节都有提到一些。# P* @9 }3 e- M. _/ h + t0 @$ ~( U$ |7 D) N6 q; ]6 ] 一句话以蔽之，用上面的方法，不要放过任何可以加快数据展示的方法，给用户尽可能最快的体验。4 J5 ~0 @% @* I2 W s( Z - z3 S& r6 m, A0 ~# t+ [0 M* l ; h/ q( o) n1 M ! d+ Q5 E- u$ D4 p3 @& Y' y" Y8 ]. Z [附加]异常流量情况 . F2 J' d$ D' l* n* p' I% d+ I ( N% _3 Y! `- \ " B3 k, J+ b( ] i* F) d9 P 6 h. Y' U2 m5 l( X+ i) i 搜索引擎蜘蛛不约而同的来采集你的网站内容。, r- c- S4 [. a; ] 0 T* f+ x! k* I5 I3 } 6 s" Y' K. g$ L0 |3 ]- i4 Y 适当干掉一些你不喜欢和需要的蜘蛛，诸如俄罗斯的一堆等，或者小众浏览器搜索引擎。在sitemap中增加访问时间间隔，或者考虑对不同蜘蛛输出不同时间。内容添加缓存。& z) ^$ K8 r9 ? - ?2 }8 m2 I$ s' ]6 }9 i2 k- M# h 内容引发热点，真实访问量大增。. n% z* Q4 W( E* O( S, ~ - v3 r# \. U) l; D( L 0 v( V8 ~8 Z8 J4 k! e 内容确实有趣/有争议/有实用价值，用户访问量增加，如果你是盈利的，那么加机器吧，如果你是非盈利的，兴趣驱动，无广告的，诸如我这类小博客的，加缓存，或者加免费CDN，或者使用DNS进行多机负载。0 G( ~/ G- ~/ e, }- I 三方无聊的恶作剧/利益相关的恶意攻击/错误的域名指向' }3 {3 Q" g4 u , N, ~7 J, R; A2 e5 F( `3 F" S! N% L 6 ^1 ~' N2 q1 r( L9 U8 ]& r8 L5 ^7 { 无聊的恶作剧，包括扫描，这个避免不了，但是你可以在fail2ban、iptables、nginx/apache过滤掉一些机器人和恶作剧。# B: p; _! g# V) X3 U - ?. i. w; x! j# Y 如果是SYN的话，瓶颈在带宽资源/机器资源/机器流量限制，可以考虑切换DNS（前提是有备份机器）。; O9 A* h6 L$ V% `6 e# G0 O 7 ^# c* f! ^2 w' {: r 3 b7 A0 Y) [3 S @7 `( g ; ?; R) \8 f0 j$ q j- |; a - A6 _; S, d8 ?1 e5 r4 r7 j 5 X5 t+ o w9 o+ T+ s5 ^ 你是盈利的，对用户承诺SLA，那么请考虑加硬件，加CDN，过滤IP。 你是非盈利的，诸如我这类blog，加内容缓存就好了，自己实测，压满了带宽，机器负载还是0.5以下，当然如果带宽大的话，那么机器估计压挂。如果你有备份机器，那么切换下DNS，或者除了当前域名外，使用三方托管页面进行博客备份，诸如Github Page/Issue、新浪博客之类的BSP。: ?! m# Y' y% v9 C: A 5 M- X* l1 l' b# [: M A( h6 A6 l 9 Z" r' \1 q( Z 暂时先写到这里，稍后把客户端缓存/参考物和优化后的对比的坑填了。. C: n+ D6 K/ ^# Q/ f5 Q) N Z C" z6 i* d* n6 ], n( e - f& r7 x& s4 |3 {1 M6 m ; o$ Y0 y" [3 J' ~9 F# X 4 o' {6 G# X' G. z. E5 ~+ ]4 ^ $ T! [; i6 m- `: D2 p# ]2 v0 w' F: A
查看全部评分
相关帖子
[复制链接]
发表于 2016-7-21 17:06:25
发表于 2016-7-21 17:37:37
发表于 2016-7-21 17:50:03
发表于 2016-7-21 17:52:50
楼主
发表于 2016-7-21 18:27:41
看完感觉很一般，而且国内的没啥参考意义。。。
