Google 的 HTML 代碼看著很亂，為什麼要寫成這樣呢？

01-14

他的html代碼用了什麼不常用的技術..

我們在編寫代碼的時候常常用了很多空格或者縮進，這樣一眼就能看出大概寫什麼，比如html在最左端，head和body往右邊縮進一點，if，div什麼的相對與head或body也向右邊縮進一點。

這主要是為了給人看，但是多了這麼多空格，可讀性是增加了，可是頁面的大小卻大了。

如果壓縮掉，原先10K的可能變成6K，那麼就節省了4K，100個用戶原先要下載1000K的，現在只要600K，流量就節省了400K，GOOGLE瀏覽量那麼大，1000萬用戶呢？一億用戶呢？這樣可以節約流量。

反正99%的人沒事不會去看google的源碼，可讀性不重要，google內部是有帶了空格的可讀性好的版本，如果想改代碼，改完了再壓縮，才放上去。還有的看起來比較亂不是html也不是javascript等語言的，那麼肯定就是加密過了的。跟亂碼似的，但是瀏覽器還是能讀出來

=== 下面內容更新於 2014-12-12 ===

Why does Google use inline JavaScript and CSS on its homepage?

這個同樣也是為了節省請求次數，加快速度，節省流量。【Quora】

基本的道理，鄭誠的回答已經很清楚了

對於想更深入了解的，可以參考一下雅虎的前端優化XX條(記得最開始看的時候還是14條，現在已經34條了，天……)

對於已經看過這些原則，早已瞭然於胸的，我再補點料。

google首頁可能是有史以來pv最高的頁面，其優化也比較極端，極端到以下兩種做法我在別的網站從來沒見到過(我沒有詳細考證google的其他頁面是否也有這樣的處理)：

1. 在伺服器端處理跨瀏覽器兼容，根據User-Agent返回不同的頁面內容

對於跨瀏覽器兼容，傳統的做法包括：用js判斷瀏覽器類型做不同處理、使用css hack、瀏覽器私有標記/屬性。總而言之，在瀏覽器端搞定兼容性。

但這並不是唯一的解決方案，更不是對用戶最優的。如果能承受工作量，可以做到在伺服器端處理，則兼容性相關的代碼不必傳給用戶，可以節省相關的網路流量。而google首頁就是這樣做的。

可以給firefox裝個ua switcher，一試便知。

我覺得，大多數網站，可能沒有這種頁面簡單，而又pv巨巨高的頁面來玩這套。但將工作量向伺服器端轉移，可以成為一種思路，比如jquery庫中，很多代碼在處理特定瀏覽器中的問題，那不妨分瀏覽器編譯出若干版本，在體積和執行效率上都有優勢。

2. 為減小頁面體積，不惜違背規範

這個要只是屬性不寫雙引號之類的，也就不拿出來說事了。

但你打開google首頁，找不到&和&，這是故意的。

我彷彿記得歷史上，在google首頁還沒有+1的時候，曾經看過對ie一些版本故意不聲明doctype和&，直接寫內容，在quirks模式下排版，從而將體積壓縮至極限的做法，不過現在無從證實了。

(註：http://g.cn目前仍是這種風格，不過http://g.cn不同瀏覽器的代碼是相同的)

這種玩法，我覺得看個熱鬧就行吧，玩火容易燒到自己。不過倒是可以順便消除一些對規範，對w3c驗證的宗教化心態。畢竟應該重視的，是最終效果和源代碼。html這種中間產物，夠用就行：）

開發時都是很整齊，並且備註齊全。但上線時都經過過濾，把最簡化的純編譯內容變成頁面。用戶要的只是結果，這樣又節餘流量。

不是的。是經過壓縮了，節省了文件的空格空間。

Google的前端絕大部分是通過javascript庫Closure來實現的，通過javascript代碼動態生成html代碼，所以Googler們不直接寫html，也就不在意html是否整齊可讀，只需維持javascript代碼的可讀性和可維護性即可。

此外，Closure引進了javascript編譯的概念，可以通過編譯，對javascript代碼進行優化，壓縮，混淆等操作，也就實現了節省流量的目的。

前面有朋友提到Google主頁不規範的問題，正是由於使用了Closure。仔細觀察，就會發現頁面源代碼被大量混淆的javascript代碼佔據，留下一些零散的html作為佔位符，或者存儲一些常量。如果使用firebug之類的前端開發工具的話，就能看到被javascript動態改寫後的規範的HTML DOM了。

Closure庫的鏈接：

http://code.google.com/closure/

Closure推薦書籍：

http://www.amazon.com/Closure-Definitive-Guide-Michael-Bolin/dp/1449381871

對於像Google這類訪問量巨大的網站，壓縮出來的都是錢。

哪裡的，應該是放到產品環境下給壓縮了。