vue项目优化

浅谈 Vue 项目优化

关于vue在app首次加载缓慢的解决办法

nginx开启缓存

在http部分加入

    #要想开启nginx的缓存功能,需要添加此处的两行内容!
#设置Web缓存区名称为cache_one,内存缓存空间大小为500M,缓存的数据超过1天没有被访问就自动清除;访问的缓存数据,硬盘缓存空间大小为30G
proxy_cache_path /usr/local/nginx/proxy_cache_path levels=: keys_zone=cache_one:500m inactive=1d max_size=30g; #创建缓存的时候可能生成一些临时文件存放的位置
proxy_temp_path /usr/local/nginx/proxy_temp_path; fastcgi_connect_timeout ;
fastcgi_send_timeout ;
fastcgi_read_timeout ;
fastcgi_buffer_size 256k;
fastcgi_buffers 256k;
fastcgi_busy_buffers_size 256k;
fastcgi_temp_file_write_size 256k;
fastcgi_intercept_errors on; client_header_timeout 600s;
client_body_timeout 600s; client_max_body_size 100m;
client_body_buffer_size 256k;

nginx开启gzip压缩

http部分加入

    gzip on;
gzip_min_length 5k;
gzip_buffers 16k;
#gzip_http_version 1.0;
gzip_comp_level ;
gzip_types text/plain application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
gzip_vary on;

nginx参考文档

nginx的web缓存服务环境部署记录

Nginx 启用gzip压缩

vue项目首次加载过慢的更多相关文章

  1. vue-router路由懒加载(解决vue项目首次加载慢)

    懒加载:----------------------------------------------------? 也叫延迟加载,即在需要的时候进行加载,随用随载. 为什么需要懒加载? 像vue这种单 ...

  2. vue 页面首次加载缓慢原因及解决方案

    第一次打包vue的项目部署到服务器,发现首次加载特别的缓慢要几十秒才加载出来,完全没有在本地开发环境上那么流畅. 主要原因是页面在打包后没有进行相关的配置导致资源文件特别大,一次想要全部加载完成回特别 ...

  3. vue页面首次加载缓慢原因及解决方案

    第一次打包vue的项目部署到服务器下时,发现初次加载特别的缓慢,将近20s页面才加载出来,完全没有开发环境上的那么流畅.主要原因是页面在打包后如果不进行相关配置会导致资源文件特别的大,一次想要全部加载 ...

  4. vue-router中,require代替import解决vue项目首页加载时间过久的问题

    vue的路由配置文件(routers.js),一般使用import引入的写法,当项目打包时路由里的所有component都会打包在一个js中,在项目刚进入首页的时候,就会加载所有的组件,所以导致首页加 ...

  5. 在Vue项目中加载krpano全景图

    在Vue-cli项目中做krpano全景图编辑器的时候,由于js插件的路径是动态的,做的过程中遇到了加载不到资源的难题,在网上搜索了好久也没找到合适的办法,最后想到了可能是JS加载的问题,于是解决了问 ...

  6. vue项目未加载完成前显示loading...

    1.在Index.html里面加入loading的元素,让loading元素显示,让app元素隐藏 <!DOCTYPE html> <html> <head> &l ...

  7. vue 首次加载缓慢/刷新后加载缓慢 原因及解决方案

    # vue 首次加载缓慢/刷新后加载缓慢 原因及解决方案 最近做项目发现一个问题,页面每次刷新后加载速度都非常慢,20s左右,在开发环境则非常流畅,几乎感觉不到,本文参考望山的各种方案优化 1,关闭打 ...

  8. vue--按需加载的3种方式(解决网页首次加载速度慢的问题)

    一.vue的异步组件加载 使用异步组件加载,打包的时候会将每个组件分开打包到不同的js文件中: {path: '/index', name: 'index', meta:{ title:'首页', r ...

  9. vue单页应用首次加载太慢之性能优化

    问题描述: 最近开发了一个单页应用,上线后发现页面初始加载要20s才能完成,这就很影响用户体验了,于是分析原因,发现页面加载时有个 vendor.js达到了3000多kb,于是在网上查找了一下原因,是 ...

随机推荐

  1. [转帖]git、github、gitlab之间的关系

    Git - 版本控制工具 Github - 一个网站,提供给用户空间创建git仓储,保存用户的一些数据文档或者代码等 GitLab - 基于Git的项目管理软件 Git分布式版本控制系统 Git是一款 ...

  2. ubuntu软件安装位置

    有时候需要配置ubuntu安装的软件,一般安装软件都是使用apt-get install.那么安装完后,软件的安装目录在哪里呢,可执行文件又放在哪里呢. A.下载的软件的存放位置:/var/cache ...

  3. python2.7.x的字符串编码到底什么鬼?(中文和英文的处理)

    一直以来我其实一直对python的编码弄得非常晕,能正常编码,也能处理一些情况.但是始终不明白有些问题究竟为何出,原因是什么,为什么要这样用. 今天晚上正好好好研究了一番解答了自己心中的困惑. Q:p ...

  4. Linux基础学习(4)--Linux常用命令

    第四章——Linux常用命令 一.文件处理命令 1.命令格式与目录处理命令ls: (1)命令格式:命令 [-选项] [参数]   例:ls -la /etc (2)说明:个别命令使用不遵循此格式;当有 ...

  5. loadrunner基础学习笔记二

    virtual user generator(vugen) 在测试环境中,loadrunner在物理计算机上使用vuser代替实际用户.vuser以一种可重复.可预测的方式模拟典型用户的操作,对系统施 ...

  6. Delphi.XE2破解方法

    我安装的是Delphi.XE2.RTM.v16.0.4256.43595.Lite.v5.0 ,安装完后打开显示是15天试用. 退出XE2后把C:\Program Files\Embarcadero\ ...

  7. cordic——sincos

    phase format :scaled radians,归化到多少pi roundmode :nearest even 近似值 coarse rotation: selected-pi——pi.no ...

  8. caffe配置NCCL

    设置Makefile.config 打开开关: USE_NCCL := 1, 并添加nccl库路径 USE_NCCL := 1 INCLUDE_DIRS += /path/nccl/build/inc ...

  9. BZOJ4455 ZJOI2016小星星(容斥原理+树形dp)

    相当于给树上的每个点分配一个编号使父亲和儿子间都有连边. 于是可以考虑树形dp:设f[i][j][k]为i号点的编号为j,其子树中编号集合为k的方案数.转移显然.然而复杂度3n·n3左右,具体我也不知 ...

  10. IDEA上传码云报错Push rejected: Push to origin/master was rejected

    原因是README.md文件冲突,码云上在创建项目的时候不要初始化README.md,然后再用IDEA上传