2022-02-27 Vue 中使用 KeepAlive

news/2024/7/10 2:51:14 标签: vue

在一些渲染成本比较高的组件需要被经常切换时,可以使用 keep-alive 来缓存这个组件。

而在使用 keep-alive 后,被 keep-alive 包裹的组件在经过第一次渲染后的 vnode 以及 DOM 都会被缓存起来,然后在下一次再次渲染该组件的时候,直接从缓存中拿到对应的 vnode 和 DOM,然后渲染,并不需要再走一次组件初始化,render 和 patch 等一系列流程,减少了 script 的执行时间,性能更好。

滥用 keep-alive 只会让应用变得更加卡顿,因为它会长期占用较大的内存。


http://www.niftyadmin.cn/n/890447.html

相关文章

2022-02-28 viewport

<meta name"viewport" content"width500, initial-scale1">width&#xff1a;页面宽度&#xff0c;可以取值具体的数字&#xff0c;也可以是 device-width&#xff0c;表示跟设备宽度相等height&#xff1a;页面高度&#xff0c;可以取值具体的数字&…

2022-03-01 CSS方式隐藏页面元素

opacity: 0&#xff1a;本质上是将元素的透明度将为0&#xff0c;就看起来隐藏了&#xff0c;但是依然占据空间且可以交互visibility: hidden&#xff1a;与上一个方法类似的效果&#xff0c;占据空间&#xff0c;但是不可以交互了overflow: hidden&#xff1a;这个只隐藏元素溢…

2022-03-02 模块化

模块化开发在现代开发中已是必不可少的一部分&#xff0c;它大大提高了项目的可维护、可拓展和可协作性。通常&#xff0c;我们在浏览器中使用 ES6 的模块化支持&#xff0c;在 Node 中使用 commonjs 的模块化支持。 分类 es6&#xff1a;import / exportcommonjs&#xff1a…

2022-03-03 Vue 重置 data

使用 Object.assign()vm.$data 可以获取当前状态下的 datavm.$options.data(this) 可以获取到组件初始化状态下的 dataObject.assign(this.$data, this.$options.data(this))

2022-03-04 购买阿里云服务器ECS搭建个人网站

基础配置 付费模式&#xff1a;包年包月地域及可用区&#xff1a;华南3&#xff08;广州&#xff09;实例规格&#xff1a;突发性能实例 t6镜像&#xff1a;公共镜像 CentOS 7.4 64位存储&#xff1a;高效云盘 20GiB 网络和安全组 网络&#xff1a;默认专有网络带宽计费模式…

2022-03-05 使用 putty 远程连接阿里云服务器

打开 putty&#xff0c;在光标处输入云服务器ECS实例的公网IP地址&#xff0c;点击 Open输入云服务器的登录名 root 及自定义的登录密码进入宝塔面板官网&#xff0c;选择 Linux 版&#xff0c;立即安装&#xff0c;复制 Centos 安装命令到 putty 远程连接工具窗口安装安装完成…

2022-03-06 宝塔面板部署 vue+node 项目

打开宝塔面板&#xff0c;在软件商店中搜索安装 Nginx、MySQL 和 PM2管理器点击左侧导航的 文件&#xff0c;进入到 /www/wwwroot 目录&#xff0c;将后端项目文件夹中的 node_modules 文件夹删除后&#xff0c;上传后端项目文件夹到此处进入上传的后端项目文件夹&#xff0c;点…

2022-03-07 JavaScript 中返回值为 undefined 的情况

访问声明&#xff0c;但是没有初始化的变量访问不存在的属性访问函数的参数没有被显式地传递值访问任何被设置为 undefined 值的变量没有定义 return 的函数隐式返回函数 return 没有显式地返回任何内容