1.什么是CSS Hack?
一般來說是針對不同的瀏覽器寫不同的CSS,就是 CSS Hack。IE瀏覽器Hack一般又分為三種,條件Hack、屬性級Hack、選擇符Hack(詳細參考CSS文檔:css文檔)。例如:
// 1、條件Hack
<!--[if IE]>
<style>
.test{color:red;}
</style>
<![endif]-->
// 2、屬性Hack
.test{
color:#090\9; /* For IE8+ */
*color:#f00; /* For IE7 and earlier */
_color:#ff0; /* For IE6 and earlier */
}
// 3、選擇符Hack
* html .test{color:#090;} /* For IE6 and earlier */
* + html .test{color:#ff0;} /* For IE7 */
2.簡述同步和異步的區(qū)別
同步是阻塞模式,異步是非阻塞模式。
(1)同步就是指一個進程在執(zhí)行某個請求的時候,若該請求需要一段時間才能返回信息,那么這個進程將會一直等待下去,直到收到返回信息才繼續(xù)執(zhí)行下去;
(2)異步是指進程不需要一直等下去,而是繼續(xù)執(zhí)行下面的操作,不管其他進程的狀態(tài)。當有消息返回時系統(tǒng)會通知進程進行處理,這樣可以提高執(zhí)行的效率.
3.什么叫優(yōu)雅降級和漸進增強?
漸進增強 progressive enhancement:
針對低版本瀏覽器進行構建頁面,保證最基本的功能,然后再針對高級瀏覽器進行效果、交互等改進和追加功能達到更好的用戶體驗。
優(yōu)雅降級 graceful degradation:
一開始就構建完整的功能,然后再針對低版本瀏覽器進行兼容。
區(qū)別:
a. 優(yōu)雅降級是從復雜的現狀開始,并試圖減少用戶體驗的供給
b. 漸進增強則是從一個非?;A的,能夠起作用的版本開始,并不斷擴充,以適應未來環(huán)境的需要
c. 降級(功能衰減)意味著往回看;而漸進增強則意味著朝前看,同時保證其根基處于安全地帶
4.Javascript中callee和caller的作用?
caller是返回一個對函數的引用,該函數調用了當前函數;
callee是返回正在被執(zhí)行的function函數,也就是所指定的function對象的正文。
5.一次完整的HTTP事務是怎樣的一個過程?
基本流程:
a. 域名解析
b. 發(fā)起TCP的3次握手
c. 建立TCP連接后發(fā)起http請求
d. 服務器端響應http請求,瀏覽器得到html代碼
e. 瀏覽器解析html代碼,并請求html代碼中的資源
f. 瀏覽器對頁面進行渲染呈現給用戶
6.對前端工程師這個職位你是怎么樣理解的?
a. 前端是最貼近用戶的程序員,前端的能力就是能讓產品從 90分進化到 100 分,甚至更好
b. 參與項目,快速高質量完成實現效果圖,精確到1px;
c. 與團隊成員,UI設計,產品經理的溝通;
d. 做好的頁面結構,頁面重構和用戶體驗;
e. 處理hack,兼容、寫出優(yōu)美的代碼格式;
f. 針對服務器的優(yōu)化、擁抱最新前端技術。
7.什么是語義化的HTML?
(1)直觀的認識標簽 對于搜索引擎的抓取有好處,用正確的標簽做正確的事情!
(2)html語義化就是讓頁面的內容結構化,便于對瀏覽器、搜索引擎解析;在沒有樣式CCS情況下也以一種文檔格式顯示,并且是容易閱讀的。搜索引擎的爬蟲依賴于標記來確定上下文和各個關鍵字的權重,利于 SEO。
(3)使閱讀源代碼的人對網站更容易將網站分塊,便于閱讀維護理解。
8.頁面導入樣式時,使用link和@import有什么區(qū)別?
(1)link屬于XHTML標簽,除了加載CSS外,還能用于定義RSS, 定義rel連接屬性等作用;而@import是CSS提供的,只能用于加載CSS;
(2)頁面被加載的時,link會同時被加載,而@import引用的CSS會等到頁面被加載完再加載;
(3)import是CSS2.1 提出的,只在IE5以上才能被識別,而link是XHTML標簽,無兼容問題;
9.對Node的優(yōu)點和缺點提出了自己的看法?
(優(yōu)點)
因為Node是基于事件驅動和無阻塞的,所以非常適合處理并發(fā)請求,
因此構建在Node上的代理服務器相比其他技術實現(如Ruby)的服務器表現要好得多。
此外,與Node代理服務器交互的客戶端代碼是由javascript語言編寫的,
因此客戶端和服務器端都用同一種語言編寫,這是非常美妙的事情。
(缺點)
Node是一個相對新的開源項目,所以不太穩(wěn)定,它總是一直在變,
而且缺少足夠多的第三方庫支持??雌饋?,就像是Ruby/Rails當年的樣子。
10.你有哪些性能優(yōu)化的方法?
(1) 減少http請求次數:CSS Sprites, JS、CSS源碼壓縮、圖片大小控制合適;網頁Gzip,CDN托管,data緩存 ,圖片服務器。
(2)前端模板 JS+數據,減少由于HTML標簽導致的帶寬浪費,前端用變量保存AJAX請求結果,每次操作本地變量,不用請求,減少請求次數
(3) 用innerHTML代替DOM操作,減少DOM操作次數,優(yōu)化javascript性能。
(4) 當需要設置的樣式很多時設置className而不是直接操作style。
(5) 少用全局變量、緩存DOM節(jié)點查找的結果。減少IO讀取操作。
(6) 避免使用CSS Expression(css表達式)又稱Dynamic properties(動態(tài)屬性)。
(7) 圖片預加載,將樣式表放在頂部,將腳本放在底部 加上時間戳。
(8) 避免在頁面的主體布局中使用table,table要等其中的內容完全下載之后才會顯示出來,顯示div+css布局慢。對普通的網站有一個統(tǒng)一的思路,就是盡量向前端優(yōu)化、減少數據庫操作、減少磁盤IO。向前端優(yōu)化指的是,在不影響功能和體驗的情況下,能在瀏覽器執(zhí)行的不要在服務端執(zhí)行,能在緩存服務器上直接返回的不要到應用服務器,程序能直接取得的結果不要到外部取得,本機內能取得的數據不要到遠程取,內存能取到的不要到磁盤取,緩存中有的不要去數據庫查詢。減少數據庫操作指減少更新次數、緩存結果減少查詢次數、將數據庫執(zhí)行的操作盡可能的讓你的程序完成(例如join查詢),減少磁盤IO指盡量不使用文件系統(tǒng)作為緩存、減少讀寫文件次數等。程序優(yōu)化永遠要優(yōu)化慢的部分,換語言是無法“優(yōu)化”的。
11..http狀態(tài)碼有那些?分別代表是什么意思?
100-199 用于指定客戶端應相應的某些動作。
200-299 用于表示請求成功。
300-399 用于已經移動的文件并且常被包含在定位頭信息中指定新的地址信息。
400-499 用于指出客戶端的錯誤。400 1、語義有誤,當前請求無法被服務器理解。401 當前請求需要用戶驗證 403 服務器已經理解請求,但是拒絕執(zhí)行它。
500-599 用于支持服務器錯誤。 503 – 服務不可用