原创 Vue2.0生命週期（組件鉤子函數與路由守衛）

組件相關鉤子函數： beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、beforeDestroy、destoryed 還有兩個特殊的（使用keep-alive）：a

2018-10-12 22:45:20 2

原创 淺談React前後端同構防止重複渲染

什麼叫前後端同構？ 爲了解決某些問題（比如SEO、提升渲染速度等）react 提供了2個方法在服務端生成一個HTML文本格式的字符串。在得到了這個HTML格式的字符串之後，通常會將其組裝成一個頁面直接返回給用戶的瀏覽器。 到這裏，服務端的

2018-09-18 23:15:18 1

原创 JS模塊規範

AMD規範AMD規範，全稱”Asynchronous Module Definition”，稱爲異步模塊加載規範。一般應用在瀏覽器端。流行的瀏覽器端異步加載庫RequireJS（中文網站）實現的就是AMD規範。下面是使用AMD規範定義一個

2018-08-22 04:24:12 2

原创 css與 js動畫 優缺點比較

我們經常面臨一個抉擇：到底使用JavaScript還是CSS動畫，下面做一下對比JS動畫缺點：(1)JavaScript在瀏覽器的主線程中運行，而主線程中還有其它需要運行的JavaScript腳本、樣式計算、佈局、繪製任務等,對其干擾導致

2018-08-22 04:24:12 5

原创 React組件掛載優化

做慣了react的首屏加載優化、代碼結構優化、dom diff優化，卻很少從react組件掛載做切入點動些邪念，嘻嘻嘻。。。。所以今天被問及這個問題時，回答的就有點隔靴搔癢，沒能直擊面試官的G點。。。。當時我答定義一個isMounted變

2018-08-22 04:24:12

原创 react前端開發規範總結

代碼規範javascript格式規範使用標準ECMAScript 6使用 ECMAScript 6 作爲源碼標準。參見 ECMA-262 6th Edition縮進使用兩個空格爲一個縮進單位123[ 1, 2, 3, 4, 5 ].map

2018-08-22 04:24:10

原创 前端程序員必須知道的高性能Javascript知識

想必大家都知道，JavaScrip是全棧開發語言，瀏覽器，手機，服務器端都可以看到JS的身影。 本文會分享一些高效的JavaScript的最佳實踐，提高大家對JS的底層和實現原理的理解。數據存儲計算機學科中有一個經典問題是通過改變數據存儲

2018-08-22 04:24:10

原创 瀏覽器加載、解析、渲染的過程

爲什麼要了解瀏覽器加載、解析、渲染這個過程？好，我們先說一下，爲什麼要了解這些呢？如果想寫出一個最佳實踐的頁面，就要好好了解。瞭解瀏覽器如何進行加載，可以在引用外部樣式文件，外部js時，將他們放到合適的位置，使瀏覽器以最快的速度將文件加載

2018-08-22 04:24:10

原创 Web安全之點擊劫持（ClickJacking）

點擊劫持（ClickJacking）是一種視覺上的欺騙手段。大概有兩種方式，一是攻擊者使用一個透明的iframe，覆蓋在一個網頁上，然後誘使用戶在該頁面上進行操作，此時用戶將在不知情的情況下點擊透明的iframe頁面；二是攻擊者使用一張圖

2018-08-22 04:24:10 2

原创 renderToString和renderToStaticMarkup的區別

renderToString 方法渲染的時候帶有 data-reactid 屬性. renderToStaticMarkup 則沒有 data-reactid 屬性， 可以節省一點流量. data-reactid 簡單的說就是 react

2018-08-22 04:24:10

原创 理解react16.3的fiber架構

一.目標Fiber是對React核心算法的重構，2年重構的產物就是Fiber reconciler核心目標：擴大其適用性，包括動畫，佈局和手勢。分爲5個具體目標（後2個算送的）：把可中斷的工作拆分成小任務對正在做的工作調整優先次序、重做、

2018-08-22 04:24:10

原创 js事件委託處理dom

事件委託就是根據事件冒泡原理，用父級來觸發子級的事件。利用事件委託可以解決多個兄弟節點綁定問題，動態創建的html事件綁定問題等。一、多個兄弟節點事件綁定例如，給ul下的li添加事件：<ul id="wrap">  <li>item1</

2018-08-22 04:24:10 2

原创 React更新日誌

-----------------------------------------------------------------------------------------------------------------------

2018-08-22 04:24:10

原创 JS-斜槓和反斜槓的轉換

例子：var url = "http://localhost:64177/Home/AccordionIndex";將斜槓轉換成反斜槓：url = url .replace("\/\/", "\\\\");url = url .repla

2018-08-22 04:24:10 3

原创 JavaScript 垃圾回收

avaScript垃圾回收的機制很簡單：找出不再使用的變量，然後釋放掉其佔用的內存，但是這個過程不是時時的，因爲其開銷比較大，所以垃圾回收器會按照固定的時間間隔週期性的執行。變量生命週期不再使用的變量也就是生命週期結束的變量，當然只可能是

2018-08-22 04:23:57 5