.net5 Blazor wasm 使用.br文件緩解 初次加載過慢的問題

官方文檔地址

https://docs.microsoft.com/zh-cn/aspnet/core/blazor/host-and-deploy/webassembly?view=aspnetcore-5.0

官方文檔對英文不好的人也不友好!!翻譯的總看懵

之前一直在測試.net的中間件實現 Brotli 沒成功   反正一路坑吧!!

然后大佬指點后找到 上面的解決方案

就是直接下載發布時候已經自動生成的.br文件   其實就是用Brotli壓縮后的文件 不下載.dll文件嘍

 

ok 發整理過的方法，易讀易用

最終效果  

1 新增一個decode.js   

2 修改index.html文件內容

 

decode.js   來自 https://github.com/google/brotli/blob/master/js/decode.js

 

index.html修改內容

替換為下面的代碼  

 

 

 
<script src="decode.js"></script>
<script src="_framework/blazor.webassembly.js" autostart="false"></script>
<script>
  Blazor.start({
    loadBootResource: function (type, name, defaultUri, integrity) {
      if (type !== 'dotnetjs' && location.hostname !== 'localhost') {
        return (async function () {
          const response = await fetch(defaultUri + '.br', { cache: 'no-cache' });
          if (!response.ok) {
            throw new Error(response.statusText);
          }
          const originalResponseBuffer = await response.arrayBuffer();
          const originalResponseArray = new Int8Array(originalResponseBuffer);
          const decompressedResponseArray = BrotliDecode(originalResponseArray);
          const contentType = type === 
            'dotnetwasm' ? 'application/wasm' : 'application/octet-stream';
          return new Response(decompressedResponseArray, 
            { headers: { 'content-type': contentType } });
        })();
      }
    }
  });
</script>

　　

 

 

就ok了~  沒了  上傳服務器運行看看吧  下載的都是.br的文件了   看下大小  是不是小了一點

小一點是一點吧  希望以后blazor有更好的方法或者需要下載的文件縮小更多!!