官方文檔中介紹：漸進式技術棧（漸進式即可以階段性地使用Vue，或者可以在使用jQuery的同時，部分模塊上使用Vue，而不是像Angular一樣一用就是全部使用）

在設計上，使用MVVM（Model-View-View-Model）模式，即當View變化時會更新Model，Model變化View也隨之改變（雙向綁定）

　　傳統前端模式（萬精油模式）:jQuery + SeaJS(RequireJS) 模塊化腳本 + artTemplate 前端模板，分離數據與HTML + Gulp 合並壓縮代碼

　　當項目擴大，出現復雜的業務時，傳統模式的效率和開發成本無法滿足需求

或者從個人理解來說：在簡單的項目，如介紹頁面等，使用jQuery會更加高效，當項目操作復雜，如管理頁面等，使用Angular/React/Vue更高效滿足需求

在之前的自整理隨筆中寫到過，jQueru為對DOM的操作，而Vue的MVVM模式使得只關心數據，DOM層會由Vue自動，如下：

　　在數據量大時，jQuery會變得難以維護（需要同時關註DOM和數據）

<!--jquery寫法-->
<div id="app">
    <button v-if="show" v-on:click="chick">chick</button>
</div>

<script>
    $("button").click(function () {
        console.log(
 
"chick")
        $("button").hide();
    });
</script>

<!--vue寫法-->
<div id="app">
    <button v-if="show" v-on:click="chick">chick</button>
</div>

<script>
    new Vue({
        el: ‘#app‘,
        data: {
            show: true;
        }
        methods: {
            chick: 
 
function () {
                console.log("chick")
            }
        }
    })
</script>

另一個書上給出的例子如下

在使用jQuery時，使用循環判斷次數，然後插入DOM元素

<div id="app">
    <ul>
    </ul>
</div>

<script>
    for (i = 0; i <= data.length; ++i) {
        $("#app> ul").append("<li>" + data[i] + "</li>")
    }
</script>

在使用Vue時，只需一行<li>，循環的事情交給Vue

<div id="app">
    <ul>
        <li v-for="book in books">{{book.name}}</li>
    </ul>
</div>

<script>
    new Vue({
        el: ‘#app‘,
        data: {
            books: [
                {  name: ‘《Vue.js實戰》‘ },
                {  name: ‘《JavaScript語言精粹》‘ },
                {  name: ‘《JavaScript高級程序設計》‘ },
            ]
        }
    })
</script>

Vue.js實戰 學習筆記 一（初識Vue.js）