Vue 性能优化篇 (二、第三方CDN加速)

一、引入第三方CDN资源,网址:http://www.bootcdn.cn/

        (1)vue最外层index.html 文件引入资源文件引入如下
        <!DOCTYPE html>
        <html>
            <head>
                <meta charset="utf-8">
                <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0">
                <meta name="apple-mobile-web-app-capable" content="yes">
                <meta content="black" name="apple-mobile-web-app-status-bar-style">
                <meta name="renderer" content="webkit">
                <link rel="shortcut icon" href="static/favicon.ico"/>
                <title></title>
                <link href="https://cdn.bootcss.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet">
                <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
                <script src="https://cdn.bootcss.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
                <script src="https://cdn.bootcss.com/vue/2.5.2/vue.min.js"></script>
                <script src="https://cdn.bootcss.com/vue-router/3.0.1/vue-router.min.js"></script>
            </head>
            <body>
                <div id="app"></div>
                <!-- built files will be auto injected -->
            </body>
    </html>

    ( 2 ) CDN引入vue vue-router 步骤
            1. 修改build --> webpack.base.conf.js文件, 修改的地方为:
                        module.exports = {
                            entry: {
                                app: ‘./src/main.js‘
                            },
                            externals:{
                                ‘BMap‘: ‘BMap‘,
                                ‘vue‘: ‘Vue‘,
                                ‘vue-router‘: ‘VueRouter‘
                            },
                        }
  ******** 必须使用Vue   VueRouter ********
            2.  main.js 和 router--> index.js 的修改:
                    // import Vue from ‘vue‘

                    // import Vue from ‘vue‘
                    // import VueRouter from ‘vue-router‘

    (未完待续)

原文地址:http://blog.51cto.com/13708381/2114367

时间: 2024-10-10 10:24:01

Vue 性能优化篇 (二、第三方CDN加速)的相关文章

Vue 性能优化篇(一、图片优化 )

一.图片保存阶段 ps 或 sketch 等图片,保存时或保存后,使用photoshop 1..jpg 图片选择 "连续" 2..png图片选择 "优化" 二. 图片压缩 1.访问 https://tinypng.com/ 对所有图片进行压缩,后替换(图片质量不变,可多图一起压缩) 三. 单色icon 使用iconfont 1.访问 http://www.iconfont.cn/ 上传和使用iconfont 原文地址:http://blog.51cto.com/13

【朝花夕拾】Android性能优化篇之(一)序言及JVM篇

序言        笔者从事Anroid开发有些年头了,深知掌握Anroid性能优化方面的知识的必要性,这是一个程序员必须修炼的内功.在面试中,它是面试官的挚爱,在工作中,它是代码质量的拦路虎,其重要性可见一斑.在团队中,性能优化的工作又往往由经验丰富的老师傅来完成,可见要做好性能优化,绝不是一件容易的事情. 性能优化方面涉及的知识点比较广,有理论基础知识,也有实际操作技能,笔者将通过一系列的文章来进行整理,将主要包括Java虚拟机.内存分配.垃圾回收,android虚拟机.进程管理.内存优化.

【朝花夕拾】Android性能优化篇之(五)Android虚拟机简介

前言 Android虚拟机的使用,使得android应用和Linux内核分离,这样做使得android系统更稳定可靠,比如程序中即使包含恶意代码,也不会直接影响系统文件:也提高了跨平台兼容性.在Android4.4以前的系统中,Android系统均采用Dalvik作为运行andorid程序的虚拟机,在android发展中具有举足轻重的地位,而Android 5.0及以后的系统使用ART虚拟机取代Dalvik,在性能上做了很大的优化.本文将对这两款虚拟机做一些介绍,主要内容如下: 一.什么是Dal

linux杂谈(十二):CDN加速

1.CDN简介 ? ?今天我们来模仿一下CDN加速下的apche服务器访问.那么我们首先来了解一下什么是CDN加速. ? ?DN的全称是Content Delivery Network,即内容分发网络.其目的是通过在现有的Internet中增加一层新的网络架构,将网站的内容发布到最接近用户的网络"边缘",使用户可以就近取得所需的内容,提高用户访问网站的响应速度. ? ?举一个例子:我们要访问腾讯的新闻网,那我们是直接去访问深圳总部的服务器么?当然不是,这样不仅服务器的负载接受不了,而且

MySQL性能优化(二)

1.MySQL基础操作 一:MySQL基础操作 1:MySQL表复制 复制表结构 + 复制表数据 create table t3 like t1; --创建一个和t1一样的表,用like(表结构也一样) insert into t3 select * from t1; --t1的数据全部拿过来,注意是表结构一致才select* ,否则选择相应的的字段列插入 create table t1( id int unsigned not null auto_increment primary key,

C++应用程序性能优化(二)——C++对象模型

C++应用程序性能优化(二)--C++对象模型 一.C++对象模型与性能优化 对象模型是面向对象程序设计语言的重要方面,会直接影响面向对象语言编写程序的运行机制以及对内存的使用机制,因此了解对象模型是进行程序性能优化的基础.只有深入理解C++对象模型,才能避免程序开发过程中一些不易发现的内存错误,从而改善程序性能,提高程序质量. 二.C++程序的内存分布 1.程序内存分布简介 通常,计算机程序由代码和数据组成,因此代码和数据也是影响程序所需内存的主要因素.代码是程序运行的指令,比如数学运算.比较

【朝花夕拾】Android性能优化篇之(四)Apk打包

前言 APK,即Android Package,是将android程序和资源整合在一起,形成的一个.apk文件.相信所有的Android程序员是在IDE的帮助下,完成打包轻而易举,但对打包流程真正清楚的可能并不多.本章的内容比较简单,也是非常基础的内容,但是对理解android应用的结构却有很大的帮助.笔者写这篇文章的目的,一方面是为了弥补这方面的盲点,回顾和梳理apk打包方面的理论知识点:第二方面,是为了给后续写Android虚拟机知识做铺垫,进而去研究android的性能优化,这也是把这篇文

Android性能优化篇

很多App都会遇到以下几个常见的性能问题: 启动速度慢:界面跳转慢:事件响应慢:滑动和动画卡顿. 一.启动速度优化. 优化初始化任务: 1. 把一些初始化任务懒加载初始化 2. 把初始化任务并行化(异步化) 3. 使初始化任务可以插拔(一个任务出问题不会影响到其他的任务) 其他: 1. 控制线程数量,注意线程的使用,用自己的线程池替换三方或者二方SDK的线程池,线程太多占用cpu资源, 2. 使用缓存来减少I/O操作(读数据库,读文件,SharedPreference)减少网络请求(判断无网络直

Android开发性能优化总结(二)

接上一篇<Android开发性能优化总结(一)> 一.安卓UI性能检测与优化 UI是安卓应用程序与用户打交道的最直接途径,UI设计的好不好,直接影响到用户的体验,如果没有达到他们心目中的自然流畅细节,用户要是能够感觉出来,少则影响心情,多则卸载应用:所以一个应用的UI显示性能问题就不得不被开发人员重视. 1.UI卡顿常见原因: 在UI线程中做了耗时操作,导致UI线程卡顿: 布局Layout过于复杂,无法在16ms内完成渲染: 同一时间动画执行的次数过多,导致CPU或GPU负载过重: View过