性能优化 vue2/vue3 通过CDN 减少项目启动时间

news2024/12/26 9:18:38

其实更多可以通过压缩图片等文件大小 也会让项目运行快一些
以及尽量使用异步或者懒加载
使用CDN可以避免在项目中使用npm导入Vue的依赖项,从而减少项目启动时的加载时间
使用方法如下

<!-- Vue 2 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>

<!-- Vue 3 -->
<script src="https://cdn.jsdelivr.net/npm/vue@3"></script>

例如 vue2项目
我们可以找到根目录下的 public下的index.html
加上
在这里插入图片描述
vue3也是找到项目跟页面 index.html中加上

只是版本差异而已
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1305041.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Linux上使用一分钟搞定Kafka的安装

文章目录 一、前言二、安装三、验证是否安装成功 一、前言 一般我们要安装Kafka&#xff0c;还需要先安装JDK和Zookeeper&#xff0c;并进行相关配置。因为Kafka和Zookeeper都是运行在JVM之上的服务&#xff0c;所以需要先安装JDK。另外&#xff0c;Kafka依赖Zookeeper管理集群…

Python常用文件操作库详解与示例

更多资料获取 &#x1f4da; 个人网站&#xff1a;ipengtao.com 文件操作是编程中常见的任务之一&#xff0c;而Python提供了丰富的文件操作库&#xff0c;使得文件的读取、写入、复制、移动等操作变得非常便捷。本文将深入介绍一些Python中常用的文件操作库&#xff0c;以及它…

CSS import 规则

导入 “navigation.css” 样式到当前的样式表&#xff1a; import “navigation.css”; /* 使用字符串 / 或者 import url(“navigation.css”); / 使用 url 地址 */ 属性定义及使用说明 CSS import 用于从其他样式表导入样式规则。 import 规则必须在 CSS 文档的头部&#xff…

NSSCTF第15页(2)

[GKCTF 2020]ez三剑客-easynode 有源代码&#xff0c;点进来看 const express require(express); const bodyParser require(body-parser);const saferEval require(safer-eval); // 2019.7/WORKER1 找到一个很棒的库const fs require(fs);const app express();app.use(b…

设计模式——单例模式(Singleton Pattern)

概述 单例模式确保一个类只有一个实例&#xff0c;而且自行实例化并向整个系统提供整个实例&#xff0c;这个类称为单例类&#xff0c;它提供全局访问的方法。单例模式是一种对象创建型模式。单例模式有三个要点&#xff1a;一是某个类只能有一个实例&#xff1b;二是它必须自行…

使用发布订阅模式处理多维度复杂融合场景

场景再现&#xff1a; 模式正确封装方法&#xff1a; class Strategy {map new Map();constructor({ defaultCbs, errorCbs }) {// 默认this.map.set("default", defaultCbs ?? []);// 错误this.map.set("error", errorCbs ?? []);}// 获取条件keyg…

linux ksm实现与代码简述

KSM 全称是 Kernel Samepage Merging&#xff0c;表示相同的物理页只映射一份拷贝。 原理 在ksm初始化时&#xff08;ksm_init&#xff09;&#xff0c;注册了一个ksm_scan_thread线程&#xff0c;这个线程的核心入口是ksm_do_scan。当对一个进程第一次通过madvice(MADV_MERGE…

2023年度盘点:AIGC、AGI、GhatGPT、人工智能大模型必读书单

2023年是人工智能大语言模型大爆发的一年&#xff0c;一些概念和英文缩写也在这一年里集中出现&#xff0c;很容易混淆&#xff0c;甚至把人搞懵。 LLM&#xff1a;Large Language Model&#xff0c;即大语言模型&#xff0c;旨在理解和生成人类语言。LLM的特点是规模庞大&…

代码随想录算法训练营 | day49 动态规划 121.买卖股票的最佳时机,122.买卖股票的最佳时机Ⅱ

刷题 121.买卖股票的最佳时机 题目链接 | 文章讲解 | 视频讲解 题目&#xff1a;给定一个数组 prices &#xff0c;它的第 i 个元素 prices[i] 表示一支给定股票第 i 天的价格。 你只能选择 某一天 买入这只股票&#xff0c;并选择在 未来的某一个不同的日子 卖出该股票。设…

【详细解答】项目经VS产品经理,有什么区别?哪个更值得选择?

最近很多人咨询“项目经理跟产品经理该怎么选&#xff0c;我更适合哪个&#xff1f;”“项目经理跟产品经理哪个更有钱途 ”“项目经理转产品经理好转吗”等等&#xff0c;今天就一次性说清楚项目经理跟产品经理有什么区别&#xff0c;应该怎么选择。 不想看长篇大论的&#x…

Python 递归、闭包与装饰器的编程魔法

更多资料获取 &#x1f4da; 个人网站&#xff1a;ipengtao.com 在Python编程中&#xff0c;递归、闭包和装饰器是一些强大的工具&#xff0c;它们能够为代码增色不少&#xff0c;提高代码的可读性和灵活性。本文将深入探讨这三种编程魔法的原理和应用&#xff0c;通过丰富的示…

JavaScript实现飘窗功能

实现飘窗功能很简单 html代码 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8"><meta name"viewport" content"widthdevice-width, initial-scale1.0"><title>Document</title…

Certbot实现 HTTPS 自动续期

Certbot实现 HTTPS 自动续期 以前阿里云支持申请一年的免费https证书&#xff0c;那每年我们手动更新证书并没什么大问题&#xff0c;但现在阿里云的免费证书仅支持3个月&#xff0c;这意味着每三个月都要要申请一下证书显得非常麻烦。 下面我们使用Certbot实现ssl证书的自动…

记录hive/spark取最新且不为null的方法

听标题可能听不懂我想表达的意思&#xff0c;我来描述一下我要做的事&#xff1a; 比如采集同学对某一网站进行数据采集&#xff0c;同一个用户每天会有很多条记录&#xff0c;所以我们要取一条这个用户最新的状态&#xff0c;比如用户改了N次昵称&#xff0c;我们只想得到最后…

kubeadm搭建单master多node的k8s集群--小白文,图文教程

参考文献 K8S基础知识与集群搭建 kubeadm搭建单master多node的k8s集群—主要参考这个博客&#xff0c;但是有坑&#xff0c;故贴出我自己的过程&#xff0c;坑会少很多 注意&#xff1a; 集群配置是&#xff1a;一台master&#xff1a;zabbixagent-k8smaster&#xff0c;两台…

C语言leetcode集训一:数组

为了进一步巩固C语言基础&#xff0c;同时进一步了解leetcode刷题的流程&#xff0c;开始进行C语言的集训&#xff0c;今天是第一天&#xff0c;看看我都做了哪些题&#xff0c;因为周末&#xff0c;有点颓废&#xff0c;所以基本上都是简单题&#xff0c;现在只想睡觉...... 有…

ultralytics yolo图像分类训练案例;pytorch自有数据集图像分类案例

1、ultralytics yolo图像分类训练案例 优点:使用方便,训练过程评估指标可以方便查看 缺点:自带模型少,可选择自定义小 参考:https://docs.ultralytics.com/tasks/classify/#val https://blog.csdn.net/weixin_42357472/article/details/131412851 1)数据集格式 https://…

一文让你认识什么是springboot(创建第一个 SpringBoot 程序)

文章目录 前言1. 环境准备2. Maven3. 第一个 SpringBoot 程序3.1 SpringBoot 介绍3.2 SpringBoot 项⽬创建3.2.1 使用 IDEA 创建3.2.2 网页版创建&#xff08;了解&#xff09; 3.3 项目代码和目录介绍3.3.1 观察pom⽂件3.3.2 父工程3.3.3 目录介绍 3.4 运行项目3.5 输出 Hello…

STM32——串口

串口发送/接收函数&#xff1a; HAL_UART_Transmit(); 串口发送数据&#xff0c;使用超时管理机制 HAL_UART_Receive(); 串口接收数据&#xff0c;使用超时管理机制 HAL_UART_Transmit_IT(); 串口中断模式发送 HAL_UART_Receive_IT(); 串口中断模式接收 HAL_UART_Tran…

线上业务优化之案例实战

本文是我从业多年开发生涯中针对线上业务的处理经验总结而来&#xff0c;这些业务或多或少相信大家都遇到过&#xff0c;因此在这里分享给大家&#xff0c;大家也可以看看是不是遇到过类似场景。本文大纲如下&#xff0c; 后台上传文件 线上后台项目有一个消息推送的功能&#…