做百度推广需要有网站吗,友情链接平台哪个好,重庆承越网站制作公司,上海响应式网站制作公司之前第一篇的时候#xff0c;因为没有用任意配置#xff0c;导致wasm加载很慢#xff0c;我就感觉不会是这样的#xff0c;为了不误导小盆友#xff0c;所以还是趁着周末研究了一波#xff0c;做了相关的调整#xff0c;经过测试#xff0c;速度基本可观了#xff0c;… 之前第一篇的时候因为没有用任意配置导致wasm加载很慢我就感觉不会是这样的为了不误导小盆友所以还是趁着周末研究了一波做了相关的调整经过测试速度基本可观了移动端也能轻松驾驭。万岁不说废话直接开整操作1、使用PWA那什么是PWA呢PWA全称Progressive Web App即渐进式WEB应用。一个 PWA 应用首先是一个网页, 可以通过 Web 技术编写出一个网页应用. 随后添加上 App Manifest 和 Service Worker 来实现 PWA 的安装和离线等功能解决了哪些问题1、可以添加至主屏幕点击主屏幕图标可以实现启动动画以及隐藏地址栏2、实现离线缓存功能即使用户手机没有网络依然可以使用一些离线功能3、实现了消息推送它解决了上述提到的问题这些特性将使得 Web 应用渐进式接近原生 App。有一句话概况可以实现部分缓存的功能到本地客户端后续刷新会加快那如何去配置呢很简单官方已经有了只需要我们创建wasm的时候勾选下就行了操作2Ngxin gzip压缩因为我们的wasm项目每次刷新需要用到很多dll的资源文件所以我们需要在nginx中进行压缩处理官方也建议我们这么做的https://docs.microsoft.com/en-us/aspnet/core/host-and-deploy/blazor/?viewaspnetcore-3.1tabsvisual-studio很简单直接在nginx.conf配置接口gzip on; # 启动压缩
gzip_min_length 5k; # 文件大小5k不压缩否则进行压缩处理
gzip_buffers 4 16k; # 设置压缩所需要的缓冲区大小
gzip_comp_level 8; #压缩级别:1-9值越大压缩的越明显
gzip_types text/plain application/x-javascript application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png application/octet-stream; # 压缩文件类型
gzip_vary on; # 是否在http header中添加Vary: Accept-Encoding建议开启
gzip_http_version 1.0;#设置gzip压缩针对的HTTP协议版本
关于相关的指令我收集了下gzip
语法: gzip on|off
默认值: gzip off
作用域: http, server, location, if (x) location
开启或者关闭gzip模块gzip_buffers
语法: gzip_buffers number size
默认值: gzip_buffers 4 4k/8k
作用域: http, server, location
设置系统获取几个单位的缓存用于存储gzip的压缩结果数据流。例如 4 4k 代表以4k为单位按照原始数据大小以4k为单位的4倍申请内存。4 8k 代表以8k为单位按照原始数据大小以8k为单位的4倍申请内存。
如果没有设置默认值是申请跟原始数据相同大小的内存空间去存储gzip压缩结果。gzip_comp_level
语法: gzip_comp_level 1..9
默认值: gzip_comp_level 1
作用域: http, server, location
gzip压缩比1 压缩比最小处理速度最快9 压缩比最大但处理最慢传输快但比较消耗cpu。gzip_min_length
语法: gzip_min_length length
默认值: gzip_min_length 0
作用域: http, server, location
设置允许压缩的页面最小字节数页面字节数从header头中的Content-Length中进行获取。
默认值是0不管页面多大都压缩。
建议设置成大于1k的字节数小于1k可能会越压越大。即: gzip_min_length 1024gzip_http_version
语法: gzip_http_version 1.0|1.1
默认值: gzip_http_version 1.1
作用域: http, server, location
识别http的协议版本。由于早期的一些浏览器或者http客户端可能不支持gzip自解压用户就会看到乱码所以做一些判断还是有必要的。注21世纪都来了现在除了类似于百度的蜘蛛之类的东西不支持自解压百度就是SX我就不说了99.99%的浏览器基本上都支持gzip解压了所以可以不用设这个值,保持系统默认即可。gzip_proxied
语法: gzip_proxied [off|expired|no-cache|no-store|private|no_last_modified|no_etag|auth|any] ...
默认值: gzip_proxied off
作用域: http, server, location
Nginx作为反向代理的时候启用开启或者关闭后端服务器返回的结果匹配的前提是后端服务器必须要返回包含Via的 header头。
off - 关闭所有的代理结果数据的压缩
expired - 启用压缩如果header头中包含 Expires 头信息
no-cache - 启用压缩如果header头中包含 Cache-Control:no-cache 头信息
no-store - 启用压缩如果header头中包含 Cache-Control:no-store 头信息
private - 启用压缩如果header头中包含 Cache-Control:private 头信息
no_last_modified - 启用压缩,如果header头中不包含 Last-Modified 头信息
no_etag - 启用压缩 ,如果header头中不包含 ETag 头信息
auth - 启用压缩 , 如果header头中包含 Authorization 头信息
any - 无条件启用压缩gzip_types
语法: gzip_types mime-type [mime-type ...]
默认值: gzip_types text/html
作用域: http, server, location
匹配MIME类型进行压缩无论是否指定text/html类型总是会被压缩的。
注意如果作为http server来使用主配置文件中要包含文件类型配置文件
最后我的nginx.conf配置文件是这样的# For more information on configuration, see:
# * Official English Documentation: http://nginx.org/en/docs/
# * Official Russian Documentation: http://nginx.org/ru/docs/user nginx;
worker_processes auto;
error_log /var/log/nginx/error.log;
pid /run/nginx.pid;# Load dynamic modules. See /usr/share/doc/nginx/README.dynamic.
include /usr/share/nginx/modules/*.conf;events {worker_connections 1024;
}http {log_format main $remote_addr - $remote_user [$time_local] $request $status $body_bytes_sent $http_referer $http_user_agent $http_x_forwarded_for;access_log /var/log/nginx/access.log main;sendfile on;tcp_nopush on;tcp_nodelay on;types_hash_max_size 2048;include /etc/nginx/mime.types;default_type application/octet-stream;# Load modular configuration files from the /etc/nginx/conf.d directory.# See http://nginx.org/en/docs/ngx_core_module.html#include# for more information.include /etc/nginx/conf.d/*.conf;keepalive_timeout 600;proxy_read_timeout 600;proxy_send_timeout 600;proxy_buffer_size 128k;proxy_buffers 32 32k;proxy_busy_buffers_size 128k;gzip on; # 启动压缩
gzip_min_length 5k; # 文件大小5k不压缩否则进行压缩处理
gzip_buffers 4 16k; # 设置压缩所需要的缓冲区大小
gzip_comp_level 8; #压缩级别:1-9值越大压缩的越明显
gzip_types text/plain application/x-javascript application/javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png application/octet-stream; # 压缩文件类型
gzip_vary on; # 是否在http header中添加Vary: Accept-Encoding建议开启
gzip_http_version 1.0;#设置gzip压缩针对的HTTP协议版本server {listen 80 default_server;listen [::]:80 default_server;server_name _;root /usr/share/nginx/html;# Load configuration files for the default server block.include /etc/nginx/default.d/*.conf;location / {}error_page 404 /404.html;location /40x.html {}error_page 500 502 503 504 /50x.html;location /50x.html {}}###### 这里是blazor wasm版本#######server {listen 5211;server_name localhost;location / {try_files $uri $uri/ /index.html;root /home/Blog.MVP.Blazor/Blog.MVP.Blazor/bin/Release/netstandard2.1/publish/wwwroot;index index.html index.htm;}
} ###### 这里是blazor.server版本 #######server {listen 80;server_name mvp.neters.club;rewrite ^(.*)$ https://$host$1 permanent;#charset koi8-r;#access_log logs/host.access.log main;location / {root html;index index.html index.htm;}}
server {listen 443 ssl;server_name mvp.neters.club; ssl_certificate /etc/nginx/conf.d/1_mvp.neters.club_bundle.crt;ssl_certificate_key /etc/nginx/conf.d/2_mvp.neters.club.key;ssl_session_timeout 5m;ssl_protocols TLSv1 TLSv1.1 TLSv1.2; ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;ssl_prefer_server_ciphers on;location / {proxy_pass http://localhost:5050;index index.php index.html index.htm;proxy_set_header Upgrade $http_upgrade;proxy_set_header Connection keep-alive;proxy_set_header Host $host;proxy_cache_bypass $http_upgrade;proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;proxy_set_header X-Forwarded-Proto $scheme;}
}
}
操作3、可以配置CDN这个我就没办法演示了虽然有azure账号可是没钱意思肯定都能明白是干啥的以后自己公司搞事情可以试试这个方案。4、结果对比服务端项目地址mvp.neters.clubwasm项目地址neters.club:5211总体来说我经过刷新三次后的响应时间分别是wasm模式总大小6m最终时间1.73sserver模式总大小约420k最终时间1.32s可能你会说这都是缓存后的敢不敢来个首次加载来看看用浏览器无痕模式重新打开试试只计算第一次加载wasm模式总大小约6m最终时间4.66sserver模式总大小约420k最终时间1.39s从数据上也能看出来首屏首次加载确实wasm比较慢共5s左右但是之后无论怎么刷新速度都会有server模式相差不大。所以最后就看你的想法了结果都在这里了。加油奥里给
