vue(1)-學習歷程之vue解決jquery的什麼痛點

vue解決jquery的痛點

首先咱們須要明白和理解jquery和vue的設計初衷和理念。

1. jquery官網給出的開篇介紹是，jquery是一個快，小，功能豐富的js庫，它讓html文檔遍歷和操做，事件處理，動畫，以及ajax等提供了簡單易用的API，而且能夠在衆多瀏覽器中使用。

   jQuery is a fast, small, and feature-rich JavaScript library. It makes
   things like HTML document traversal and manipulation, event handling,
   animation, and Ajax much simpler with an easy-to-use API that works
   across a multitude of browsers.

   全部js庫要解決的問題*： 簡單語法（查找DOM元素，對DOM元素進行操做）解決瀏覽器兼容性問題

   jquery這個js庫比其餘js庫受歡迎的地方在於：全部一切都在jquery對象裏面，入口是查詢，結果是操做

   庫，開發者自由控制，搭建前端

2. Vue (讀音 /vjuː/，相似於 view) 是一套用於構建用戶界面的漸進式框架。
   全部js框架要解決的問題*： 應對需求變化，防止大面積重寫。讓開發者遵循框架的規範和規則構建項目，追求高效，團隊協做，代碼利用率和可擴展性
   vue這個js框架比其餘js框架受歡迎的地方在於：

   組件化：一個大型頁面切分紅一個一個更小的可控單元；方便後續優化，使用組件能夠下降模塊耦合度，組件所依賴的資源所有封裝在組件內部調用。

   ---

   數據偵聽，雙向綁定：(js中有兩種方法能夠偵測到變化，object.defineProperty和ES6的proxy)vue使用的是object.defineProperty.
   咱們之因此要觀察一個數據，是爲了當數據發生變化時，能夠通知到使用該數據的地方。先把使用該數據的地方收集起來（術語是收集依賴getter），當變化時，再觸發依賴setter
   依賴收集到哪，數組Dep,存儲依賴。
   數據變化時，咱們須要集中通知給各個地方，讓中介watcher來通知吧

   ---

   客戶端路由：單頁面應用，不作就不須要，一個url對應一個應用

   ---

   大規模狀態管理： 應用簡單時，一個基礎狀態和界面映射就能夠解決問題，應用很大時，涉及多人合做，須要多個組件之間共享，多個組件須要去改動同一份狀態，如何使大規模應用高效運行。

   ---

   構建工具：打包和工程構建

---

漸進式vue框架，自底向上增量開發，爲何選擇vue而不是jquery

1. 你不想用vue的數據驅動DOM變化，不想組件化，那你能夠用vue當成一個js庫來使用，簡單的收集form表單，表單驗證。若是你碰到屢次改需求，你會發現vue要改的代碼比jquery少的多。
2. 大膽一些，你想把整個頁面的dom用Vue來管理，如新聞列表用v-for來循環，評論交互有些複雜，你抽象成小組件，這個過程就會把關注點從原來的jquery dom操做變成關注數據變化。因而你開始用虛擬dom，數據雙向綁定，差量更新
3. 你要作個webApp，因而你瞭解webpack vue-router,你發現前端能夠控制路由了，vue-router單頁面卻能夠切換組件，不是f5刷新的感受
4. 滾動播放視頻，前端和後端的接口溝通很頻繁，大量的數據在組件中共享，你找解決方法，發現vueX處理數據在組件之間流動駕輕就熟。
5. 慢慢的你開始關注用戶數據增加，你發現第2部，新聞列表和評論整個頁面用vue管理開發很方便，可是頁面白屏時間長，相似這樣的底層頁對seo很很差。你開始考慮vue 2.0的SSR。爲了保證團隊高質量輸出，你開始研究給vm寫單元測試....

綜以上5點，我真的不知道有什麼理由不用vue，由於你用了vue，你也能夠用jquery啊，在vue中何時用Jquery會更高效，答案是動畫。由於vue側重數據。

參考文獻：

1. vue漸進式框架理解：https://www.zhihu.com/questio...
2. vue核心功能原理解析https://www.cnblogs.com/dhsz/...
3. 百度網盤視頻學習以及源碼資源https://pan.baidu.com/s/1bpD6hUR 提取密碼 aebz