vue的單頁面應用訪問速度一般情況下已經很快了，不過對於比較複雜的頁面首次開啟的時候會很慢，慢的原因呢主要涉及如下兩個方面：
1、dom元素較多，首次開啟時需要進行太多的渲染和判斷，而這些渲染和判斷大多數往往都不是首次開啟頁面時需要消耗的。
2、多數首次不顯示的的dom元素，或者子元件載入時會呼叫ajax請求載入資料，這時候首次載入的請求可能有5個、10個甚至更多，這時候併發請求就會帶來競爭，首次載入現實的可能只需要1-2個請求，時間花費30ms即可，但是一旦5-10個請求併發，那麼會導致整體請求時間要達到150ms以上，這時候的體驗效果是非常差的。
基於以上兩個原因呢，咱們需要引入延遲載入的機制，目前網上存在一些延遲載入的元件，但是功能和我們的需求會有些差別，不夠靈活，所以最好的方式是自己封裝元件，vue的api中已經寫的很清楚了，基於以下兩點，證明延遲載入的機制是可行的：
1、v-if預設為false情況下不會載入元件，只有變為true的情況下才會進行載入，而且我們的元件載入後不需要銷毀（
2、子元件可以通過插槽對父元件引用子元件包裹的內容進行分發。（
由以上兩點，我們開發了延遲載入元件（**基於vue-cli的專案），子元件內容如下，命名pl-lazy:
父元件呼叫：
1、在script中引入元件（如果開發工具使用的是idea的話，輸入2、在需要延遲載入的元件上方巢狀元件即可:
這裡放的是延遲載入的元件/dom內容
如果使用的地方比較多的話，那麼每個頁面都這樣引入有點繁瑣了，咱們需要公共引入元件，這樣我們就可以更方便的使用了，要達到這個效果只需要在main.js中引入元件即可:
// 註冊全域性元件
import pllazy from "./components/common/components/pllazy";
vue.component('pl-lazy', pllazy);
資料延遲載入元件
引 目前流行的頁面延遲載入以及渲染元件，參考 kissy 所寫，練習一下yui3模組編寫。原理 2.對於螢幕外延遲渲染的html存放在隱藏 visibility hidden 的textarea中，並且該textarea佔據本該渲染的位置，監控窗體滾動，當textarea進入可見區域，將該texta...
Vue 動態載入元件
為什麼要動態載入呢？而不是一次性載入呢？一次性？你能保證你拿的內容不多，那從效能方面說還是ok的。否則，就該什麼時候用，就什麼時候取。得出這想法，源於前幾天上班趕產品的故事 a元件是父親，b元件是a元件的孩子。剛剛，我在a元件裡直接載入b元件。編譯居然用了將近一分半鐘，我都還沒加其他c孩子，d孩子呢...
Vue 元件開發
將頁面拆分為多個元件，簡化了頁面開發，方便維護，元件也可以復用。元件的型別 元件開發流程 宣告 註冊 使用 demo 元件使用流程 div id div script varmyheader varmybody varmyfooter newvue template 使用元件 script 宣告是全...