溫馨提示：以下系列的面試題是通過整合網(wǎng)上各位大牛的文章而成，站在巨人的肩膀上，能夠讓我們更進(jìn)一步。

1、頁面從輸入U(xiǎn)RL到頁面加載顯示完成，這個過程中都發(fā)生了什么？

1. 輸入域名地址
2. 發(fā)送域名地址至DNS服務(wù)器并獲得對應(yīng)WEB服務(wù)器IP地址
3. 與WEB服務(wù)器建立TCP連接
4. 服務(wù)器的永久重定向響應(yīng)（從http://example.com到http://example.com）
5. 瀏覽器跟蹤重定向地址
6. 服務(wù)器處理請求
7. 服務(wù)器返回一個HTTP響應(yīng)
8. 瀏覽器顯示HTML
9. 瀏覽器發(fā)送請求獲取的資源（如圖片、音頻、視頻、CSS、JS等等）
10. 瀏覽器發(fā)送異步請求

?2、瀏覽器工作原理

1. 用戶界面
2. 網(wǎng)絡(luò)
3. UI后端
4. 數(shù)據(jù)存儲
5. 瀏覽器引擎
6. 渲染引擎
7. js解釋器

3、瀏覽器解析過程

流程：解析html以構(gòu)建DOM樹 -> 構(gòu)建render樹 -> 布局render樹 -> 繪制render樹

4.瀏覽器內(nèi)核的理解

主要分為兩部分：渲染引擎和JS引擎

渲染引擎：負(fù)責(zé)取得網(wǎng)頁的內(nèi)容（HTML、XML、圖像等等）、整理訊息（例如加入CSS等）、以及計(jì)算網(wǎng)頁的顯示方式，然后會輸出至顯示器或打印機(jī)。

瀏覽器的內(nèi)核的不同對于網(wǎng)頁的語法解釋會有不同，所以渲染的效果也不相同。所有網(wǎng)頁瀏覽器、電子郵件客戶端以及其它需要編輯、顯示網(wǎng)絡(luò)內(nèi)容的應(yīng)用程序都需要內(nèi)核

JS引擎：解析和執(zhí)行javascript來實(shí)現(xiàn)網(wǎng)頁的動態(tài)效果

最開始渲染引擎和JS引擎并沒有區(qū)分的很明確，后來JS引擎越來越獨(dú)立，內(nèi)核就傾向于只指渲染引擎

5.常見的瀏覽器內(nèi)核有哪些

1. Trident內(nèi)核：IE瀏覽器
2. Gecko內(nèi)核： Netscape6
3. Presto內(nèi)核： Opera7以上
4. Webkit內(nèi)核： Safari,Chrome等

?6.請描述一下cookies,sessionStorage和localStorage的區(qū)別

cookie是網(wǎng)站為了標(biāo)示用戶身份而存儲在用戶本地終端（Client Side）上的數(shù)據(jù)（通常經(jīng)過加密），數(shù)據(jù)會在瀏覽器和服務(wù)器間來回傳遞。

sessionStorage和localStorage不會自動把數(shù)據(jù)發(fā)送給服務(wù)器，僅在本地保存。

存儲數(shù)據(jù)大小：

　　cookie：數(shù)據(jù)大小不能超過4k。

　　sessionStorage和localStorage：雖然也有存儲大小的限制，但比cookie大得多，可以達(dá)到5M或更大。

存儲有效時間：

　　localStorage:：存儲持久數(shù)據(jù)，瀏覽器關(guān)閉后數(shù)據(jù)不丟失除非主動刪除數(shù)據(jù)；

　　sessionStorage： 數(shù)據(jù)在當(dāng)前瀏覽器窗口關(guān)閉后自動刪除。

　　cookie： 設(shè)置的cookie過期時間之前一直有效，即使窗口或?yàn)g覽器關(guān)閉

?7.請大概描述下頁面訪問cookie的限制條件

跨域問題，設(shè)置了HttpOnly

8.如何實(shí)現(xiàn)瀏覽器內(nèi)多個標(biāo)簽頁之間的通信

調(diào)用localStorage、cookies等本地存儲方式

9.頁面可見性（Page Visibility API）可以有哪些用途

通過visibilityState的值檢測頁面當(dāng)前是否可見，以及打開網(wǎng)頁的時間等；

在頁面被切換到其他后臺進(jìn)程的時候，自動暫停音樂或視頻的播放

10.網(wǎng)頁驗(yàn)證碼是做什么的，是為了解決什么安全問題

含義：區(qū)分用戶是計(jì)算機(jī)還是人的公共全自動程序。

安全問題：防止惡意破解密碼、刷票、論壇灌水；有效防止黑客對某一個特定注冊用戶用特定程序暴力破解方式進(jìn)行不斷的登錄嘗試。

11.性能優(yōu)化？

1. 使用CDN
2. 圖片懶加載
3. 使用外部Javascript和css
4. 壓縮JavaScript、css、字體、圖片等等
5. 優(yōu)化CSS Sprite
6. 減少HTTP請求數(shù)
7. 減少DNS查詢
8. 減少DOM操作
9. 減少DOM元素?cái)?shù)量
10. 把腳本放在頁面底部

?

轉(zhuǎn)載于:https://www.cnblogs.com/wanghao123/p/9377747.html

總結(jié)

以上是生活随笔為你收集整理的前端开发工程师面试题之综合篇的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。