1、渲染優化方法
(1)禁止使用iframe。
iframe缺點:#阻塞父文檔onload事件 #搜索引擎的檢索程序不能解讀這種頁面,不利於SEO #iframe和主頁面共享連接池,而瀏覽器對相同域的連接有限制,所以會影響頁面的並行加載
#要繞開最後這個問題,最好通過JavaScript動態給iframe添加src屬性
(2)loading效果等可以通過css3代碼實現的動畫就用css3
(3)對於小圖標可以使用base64位編碼,以減少網絡請求。但是不建議大圖使用,比較耗費CPU
(4)頁面頭部的<style>和<script>會阻塞頁面。因爲Renderer進程中js線程和渲染線程是互斥的。
(5)頁面中空的href和src會阻塞頁面其他資源的加載(阻塞下載進程)
(6)多采用 網頁Gzip,cdn託管,data緩存,圖片服務器
(7)前端模板js + 數據,對於能重複利用的ajax請求結果用變量保存,減少請求次數
(8)少用全局變量,緩存DOM節點查找結果,減少IO讀取操作。
(9)避免使用css表達式
(10)圖片預加載,樣式表放在head內,腳本放在body最底部。在資源名後面加上時間戳能防止瀏覽器緩存。
如 var loadimage = `<img src="images/picture0.png?t=${new Date().getTime()}" />`;
(11)避免在頁面主題佈局中使用table,table要在其中內容完全下載後纔會顯示。可以使用ul和li的組合來代替。
2、數據庫優化(PHP面試)
3、代碼性能測試工具 postman、Jmeter、Profiler等。
4、this指向誰?
this永遠指向函數運行時所在的對象,而不是函數被創建時所在的對象。匿名函數或不處於任何對象中的函數指向windpw
(1)如果是call apply with 指定的this是誰就是誰
(2)普通的函數調用,函數被誰調用就是誰
5、box-sizing的取值區別
(1)box-sizing:content-box 相當於W3C盒子模型
(2)box-sizing:border-box 相當於IE盒子模型【怪異模式】