目錄
前端技術：
HTML：
HyperText Markup Language，超文本標記語言，它不同於編程語言；
超文本就是超出純文本的範疇，如描述文本的顏色、大小、字體等信息，或使用圖片、音頻、視頻等非文本內容；
HTML由一個個標籤組成，這些標籤各司其職，有的提供網頁信息，有的負責圖片，有的負責網頁佈局；
超文本需要顯示，就得有軟件能夠呈現超文本定義的排版格式，如顯示圖片、表格，顯示字體的大小、顏色，這個軟件就是browser；
超文本需要共享，產生了HTTP協議；
瀏覽器：
1980年，Tim Berners-Lee爲CERN（歐洲核子研究中心，當時歐洲最大的互聯網節點）設計基於超文本思想的ENQUIRE項目，以促進科研人員之間的信息共享和更新。
1989年，他編寫了《信息化管理：建議》，並構建基於internet的hypertext系統，並在CERN開發了world wide web項目，打造了世界上第一個網站，於1991-8-6正式上線；
Tim Berners-Lee於1990年發明了第一個瀏覽器，還發明瞭HTTP協議；
1994年，在MIT他創建了W3C（萬維網聯盟），負責萬維網持續發展，他提出W3C的標準應該基於無專利權、無版稅；
Marc Andreessen於1993年發明了Mosaic瀏覽器，他看到了這個技術的前景，不久後成立自己的公司——netscape；
1994年，發佈了Netscape Navigator瀏覽器，席捲全球；
1995年，MS發佈了IE，開啓第一次瀏覽器大戰，最終IE後來居上；
Netscape公司成立了Mozilla組織，使用Gecko引擎基於開源技術開發了新的瀏覽器，最終這個瀏覽器更名爲firefox，發佈於2004年；
Apple的Safari於2003年發佈第一個測試版；
2008年google的chrome瀏覽器帶着v8引擎橫空出世；
瀏覽器技術：
browser是一種特殊的客戶端，能夠基於http(s)、ftp等協議和web服務器進行交互，呈現網頁內容的軟件；
可簡單的認爲browser分爲2部分：
外殼，外殼提供用戶交互的界面；
內核，提供html、圖像的渲染引擎、提供DOM編程接口、提供javascript引擎、提供瀏覽器內建對象；
排版引擎 | 瀏覽器 | 說明 |
Trident | IE | 早期未按照W3C標準實現，兼容性較差，IE9之後內核升級已符合標準 |
Gecko | firefox | C++開發，可支持複雜的網頁效果，提供強大的瀏覽器擴展接口 |
WebKit | Safari、Chrome | 基於KHTML；網頁瀏覽速度較快，但網頁容錯性不高 |
Presto | Opera | 目前公認的網頁瀏覽速度最快的內核，但犧牲一部分兼容性 |
國內browser，一般都採用了以上的一個或兩個內核加上外殼實現；
js引擎，不同瀏覽器內核中用了不同的js引擎；
常見的js引擎有JScript、TraceMonkey(firefox)、V8等，這些引擎差異不小，實現ECMA標準不同，甚至有不按照標準實現的；
CSS：
cascading style sheets，層疊樣式表；
HTML本身爲了格式化顯示文本，但當網頁呈現在大家面前時，更多需求讓HTML提供更多樣式能力，使得HTML變得越來越臃腫，促使了CSS的誕生；
1994年，W3C成立，CSS設計小組成員加入W3C，並努力研發CSS的標準，MS最終加入；
1996-12，發佈CSS1.0；
1998-5，發佈CSS2.0；
CSS3採用了模塊化思想，每個模塊都在CSS2基礎上分別增強功能，所以這些模塊是陸續發佈的；
不同廠家的browser使用的引擎，對CSS的支持不一樣，導致網頁佈局、樣式在不同browser上不一樣，因此，想要保證不同用戶使用不同browser看到的網頁效果一樣，變得非常困難；
動態網頁技術：
js的引入使得browser可顯示動態的效果，但這不是動態網頁；
發明web技術的初衷是爲了分享文檔，這些內容是靜態的（寫好的不變的文件），通過url定位到這些文檔，將內容下載到browser上，由browser呈現；
互聯網的發展，網民的需求增加，大家希望提供交互式訪問，用戶提交需求，服務端找到需求匹配的資源併發回瀏覽器端顯示，這就是動態網頁；
動態網頁，指網頁的內容是動態的，url不變，裏面的內容變化，如訪問一個查詢頁面，提交的關鍵字不同，提交到後臺查詢並展示；
動態網頁，表現的是browser端內容的變化，而本質上它是一種服務端動態網頁技術server-side dynamic web page；
最早誕生的動態網頁技術有：ASP、JSP、PHP等，後來幾乎所有流行的高級語言都提供了開發動態網頁的能力；
網頁佈局：
早期的網頁只需要標題，使用<P>標籤分段；
來有人大量使用表格標籤，可做好很好的內容佈局，也出現結構化的佈局方案，但隨着頁面內容的堆積，出現了成百上千個表格嵌套的情況，browser繪製很慢；
後來出現了div+css佈局風格，捨棄了表格，加上js，使得前後端開發分離，而且可做到很好的自適應佈局，如流式瀑布一樣佈局（https://www.guokr.com/scientific/）；
同步&異步：
同步：
早期，網頁就是一頁頁的文本，沒什麼圖片、樣式；
後來，互聯網時代到來，網頁的內容越來越大；
瀏覽器渲染HTML，需要先下載CSS並加載，爲的是好渲染網頁，之後，下載網頁內容，並逐步渲染，構建DOM樹，加載js腳本並執行，js可能需要修改DOM網頁就要重新渲染；
如果js放在網頁head中，還需要等待js下載並加載；
圖片使用<img>標籤，是發起新的請求的，如果圖片返回，需要重新繪製網頁；
好不容易，一張網頁繪製完畢，用戶提交了請求，就是想看到查詢的結果，服務器響應到來後是一個全新的頁面內容，哪怕url不變，整個網頁都需要重新渲染，如用戶填寫註冊信息，只是2次密碼不一致，提交後，整個註冊頁面重新刷新，所有填寫項目重新填寫（有辦法讓用戶減少重填），這種交互非常不友好；
從代價的角度看，就是爲了註冊的一點點信息，結果返回了整個網頁內容，不但浪費了帶寬，還需要瀏覽器重新渲染網頁，太浪費資源了；
上面這些請求的過程，就是同步過程，用戶發起請求，頁面整個刷新，直至服務器端響應的數據到來並重新渲染；
異步：
1996年，MS實現了iframe標籤，可在一個網頁使用iframe標籤，局部異步加載內容；
1999年，MS推出異步數據傳輸的ActiveX插件技術，太笨重了，但也火了很多年，有一個組件XMLHttpRequest被大多數瀏覽器支持；
AJAX，asynchronous javascript and xml，異步javascript和xml，使用XMLHttpRequest組件，結合js，數據格式採用xml，將這三者結合，實現網頁的異步請求；
ajax是一種技術的組合，技術的重新發現，而不是發明，但是它深遠地影響了整個web開發；
2005年，google在Gmail和地圖中應用，使它大受歡迎並推廣開來；
有了異步請求，就可動態的從瀏覽器發起請求到服務器端，服務器端返回響應的數據封裝成XML（json）返回給瀏覽器，瀏覽器只需要使用js把內容加入到DOM中，局部渲染就可以了，這個過程中，整個網頁不用重新刷新，只需要局部動態改變即可；
前端開發：
早期前端開發使用網頁三劍客：dreamweaver、firework、flash；
MS的有frontpage；
不管使用什麼工具，都不能改變js兼容、css兼容、瀏覽器版本兼容的問題，非常頭疼；
2006年jQuery庫出現，有了JS框架，抹平了平臺差異，基於它產生衆多的插件，前端開發終於輕鬆了些；
2008年，V8引擎伴隨着chrome瀏覽器發佈；
2009年，ES5標準發佈；
2009年，Nodejs發佈，服務器端也可以使用JavaScriptb ;
2009年，AngularJS誕生，之後被google收購；
2010年，Backbone.js誕生；
2011年，React和ember誕生，React於2013年5月開源；
2014年，國人尤雨溪的Vue.js誕生；
2014年，HTML5標準發佈；
前端工具和框架越來越多，前端開發已經不是隨便使用一個什麼文本編輯器就可完成的了，如果使用框架，需要很多工具的配合，配置好一個開發環境非常重要；
注：
AngularJs、React、Vue.js這三個前端框架類似py的web框架Django、Flask、Tornado；
硬件發展：
最初，網頁就是簡單的文本，計算機輕鬆勝任；
後來，網頁對多媒體的支持、動態效果的支持，都需要使用大量的cpu、內存資源，甚至是顯卡的渲染能力；
所以，個人pc需要不斷升級，否則瀏覽網頁很困難；
移動互聯網到來的早期，手機看的網頁，都需要單獨處理；
手機屏幕小、cpu弱、內存小，能看的網頁純文本加小圖，這樣產生的流量小，2G時代談不上網速；
2007年，第一代iphone誕生，2008年安卓手機誕生，3G的移動互聯網時代到來了；
手機硬件水平不斷提升，手機的開發平臺可以讓衆多開發者開發app，用戶可下載安裝使用這些app；
對於開發者來說，開發就是個問題了，是不是需要開發一套iphone版本、再開發一套安卓、再開發一套網頁的版本？
2013年，中國進入4G時代，手機硬件水平也得到了很大的提升；
衆多平臺思考的是，能夠有一套架構，解決所有前端問題，還是最通用的網頁+js；
如今的前端開發，已不是以前的幾個js文件、幾百行代碼了，爲了適應需求，新框架、新編程模式不斷涌現，這些工具都大大方便了協作開發，同時解決平臺兼容性問題；