互聯(lián)網(wǎng)進(jìn)入Web2.0時(shí)代，各種類似桌面軟件的Web應(yīng)用大量涌現(xiàn)，網(wǎng)站的前端由此發(fā)生了翻天覆地的變化。下面由學(xué)習(xí)啦小編為大家整理的web前端開發(fā)的演變，希望大家喜歡!

　　web前端開發(fā)的演變

　　Web前端開發(fā)工程師是一個(gè)很新的職業(yè)，在國內(nèi)乃至國際上真正開始受到重視的時(shí)間不超過10年。Web前端開發(fā)是從網(wǎng)頁制作演變而來的，名稱上有很明顯的時(shí)代特征。在互聯(lián)網(wǎng)的演化進(jìn)程中，網(wǎng)頁制作是Web 1.0時(shí)代的產(chǎn)物，那時(shí)網(wǎng)站的主要內(nèi)容都是靜態(tài)的，用戶使用網(wǎng)站的行為也以瀏覽為主。

　　2005年以后，互聯(lián)網(wǎng)進(jìn)入Web 2.0時(shí)代，各種類似桌面軟件的Web應(yīng)用大量涌現(xiàn)，網(wǎng)站的前端由此發(fā)生了翻天覆地的變化。網(wǎng)頁不再只是承載單一的文字和圖片，各種豐富媒體讓網(wǎng)頁的內(nèi)容更加生動(dòng)，網(wǎng)頁上軟件化的交互形式為用戶提供了更好的使用體驗(yàn)，這些都是基于前端技術(shù)實(shí)現(xiàn)的。

　　其實(shí)中國的“web前端開發(fā)攻城獅” 這個(gè)職位好多人并不知道是怎么叫出來的，那么我偷偷告訴你：其實(shí)是淘寶團(tuán)隊(duì)，發(fā)明出來的本土化的名稱，因?yàn)闅v史原因，淘寶在2005以后迅速崛起，并且爆發(fā)式的訪問量，讓淘寶網(wǎng)的用戶體驗(yàn)受到巨大考驗(yàn)和急需前進(jìn)。

　　然后淘寶官方第一次有了【 web前端開發(fā)】這個(gè)字眼和招聘職位，或許其他網(wǎng)站也想到了這樣一種描述，但是畢竟知名度巨高的淘寶，受關(guān)注度自然高，口碑相傳，就把前端開發(fā) 這個(gè)叫法發(fā)揚(yáng)光大了。

　　在早期點(diǎn)Web前端不叫前端，而是被親切的叫做“網(wǎng)頁設(shè)計(jì)師”，沒錯(cuò)你沒看錯(cuò)，就是這個(gè)名字，我記得那時(shí)候 【網(wǎng)頁三劍客】的說法滿天飛，你掌握了這3賤客，真的很賤，就可以被人叫做網(wǎng)頁設(shè)計(jì)師了。

　　網(wǎng)頁三劍客：DW \ FW \ Falsh

　　網(wǎng)頁三劍客(Flash、Dreamweaver、Firewoks) 并稱為Macromedia的網(wǎng)頁制作三劍客，由于是同一公司的產(chǎn)品，因而在功能上有著一個(gè)非常緊密的結(jié)合 。后來Firewoks被Adobe這個(gè)變態(tài)的巨頭收購以后，ps就基本取代Firewoks來做設(shè)計(jì)網(wǎng)頁的工作了，雖然我知道現(xiàn)在還有人用，估計(jì)是一種懷念和某些好用的切圖功能吧。

　　而那時(shí)候的網(wǎng)頁設(shè)計(jì)師 如果要入此道，必須要掌握的就是Dreamweaver，并不是說只有他能寫html 和 css ，而是它在當(dāng)時(shí)的自動(dòng)提示實(shí)在太好用、太強(qiáng)大了，簡直不用費(fèi)腦細(xì)胞，你就可以輕輕松松的完成你所想。在當(dāng)時(shí)前端工具和編輯器貧乏的時(shí)代，這個(gè)絕對是神奇級別了(當(dāng)然后來 寫的多了都熟悉基本不用提示的)。當(dāng)年還有很多基于Dreamweaver構(gòu)建網(wǎng)站的教程，那時(shí)候真的是個(gè)基情滿滿的年代，這些工具類的歷史產(chǎn)物，有興趣的朋友可以去了解一下就好了，我們不在多舌。

　　web前端開發(fā)基礎(chǔ)

　　雖說這個(gè)問題很大，但是這個(gè)話題就很好回答了;因?yàn)楝F(xiàn)在前端如此眼花繚亂，技能多多，都是基于此三板斧：

　　HTML、CSS、JavaScript

　　語言基礎(chǔ)：HTML、CSS、JavaScript

　　思想標(biāo)準(zhǔn)：W3C標(biāo)準(zhǔn)

　　W3C萬維網(wǎng)聯(lián)盟創(chuàng)建于1994年，是Web技術(shù)領(lǐng)域最具權(quán)威和影響力的國際中立性技術(shù)標(biāo)準(zhǔn)機(jī)構(gòu)。到目前為止，W3C已發(fā)布了200多項(xiàng)影響深遠(yuǎn)的Web技術(shù)標(biāo)準(zhǔn)及實(shí)施指南，如廣為業(yè)界采用的 【超文本標(biāo)記語言】、【[標(biāo)準(zhǔn)通用標(biāo)記語言】、【可擴(kuò)展標(biāo)記語言】等。

　　有效促進(jìn)了Web技術(shù)的互相[兼容]，對互聯(lián)網(wǎng)技術(shù)的發(fā)展和應(yīng)用起到了基礎(chǔ)性和根本性的支撐作用。

　　所以 我們現(xiàn)在運(yùn)用的html 超文本標(biāo)記語言，css 等所有基于web技術(shù)的范疇，基本都是w3c標(biāo)準(zhǔn)，并全世界統(tǒng)一執(zhí)行的，所以符合w3c 也就是開啟前段之門了。

　　HTML： 是構(gòu)成網(wǎng)頁展示的基礎(chǔ)，是一種很簡單可視化的標(biāo)識語言，說白了就是 一是一，你寫二就出二。網(wǎng)上所有的網(wǎng)頁網(wǎng)站，不管多么牛鼻最后都會轉(zhuǎn)化成html，被瀏覽器渲染出來，用作展示。

　　CSS： 又稱作樣式表，簡單點(diǎn)說就是html的外衣，將html包裝的明艷動(dòng)人。

　　JavaScript：是一種直譯式腳本語言，非常靈活，可以在任何瀏覽器上開發(fā)與調(diào)試的一種動(dòng)態(tài)類型、弱類型、基于原型的語言。

　　Web前端十種優(yōu)化方式

　　1.盡量減少HTTP請求 (Make Fewer HTTP Requests)

　　2.減少 DNS 查找 (Reduce DNS Lookups)

　　3.避免重定向 (Avoid Redirects)

　　4.使得 Ajax 可緩存 (Make Ajax Cacheable)

　　5.延遲載入組件 (Post-load Components)

　　6.預(yù)載入組件 (Preload Components)

　　7.減少 DOM 元素?cái)?shù)量 (Reduce the Number of DOM Elements)

　　83切分組件到多個(gè)域 (Split Components Across Domains)

　　9.最小化 iframe 的數(shù)量 (Minimize the Number of iframes)

　　10.杜絕 http 404 錯(cuò)誤 (No 404s)