prioritize main file load

Author: vojtatranta

packages/suite-build/configs/web.webpack.config.ts

@@ -9,6 +9,8 @@ import { FLAGS, routes } from '@suite-common/suite-config';
 import { assetPrefix, isDev } from '../utils/env';
 import { getPathForProject } from '../utils/path';
 
+const PreloadWebpackPlugin = require('@vue/preload-webpack-plugin');
+
 const baseDir = getPathForProject('web');
 const config: webpack.Configuration = {
     target: 'browserslist',
@@ -74,6 +76,18 @@ const config: webpack.Configuration = {
             /@trezor\/connect$/,
             '@trezor/connect-web/src/module',
         ),
+        new PreloadWebpackPlugin({
+            rel: 'preload',
+            include: 'allChunks',
+            fileWhitelist: [/^main\.[^.]+\.js$/],
+        }),
+        new PreloadWebpackPlugin({
+            rel: 'preconnect',
+            include: 'asyncChunks',
+            // NOTE: only prefetch js files
+            fileWhitelist: [/\.js$/],
+            fileBlacklist: [/_svg\.js$/, /date-fns/, /json\.js/, /suite-data/],
+        }),
         ...(!isDev ? [new CssMinimizerPlugin()] : []),
     ],
 };

packages/suite-build/package.json

@@ -25,6 +25,7 @@
         "@suite-common/suite-config": "workspace:*",
         "@trezor/bundler-security": "workspace:*",
         "@trezor/suite": "workspace:*",
+        "@vue/preload-webpack-plugin": "^2.0.0",
         "babel-loader": "^9.1.3",
         "babel-plugin-styled-components": "^2.1.4",
         "copy-webpack-plugin": "^12.0.2",

yarn.lock

@@ -12348,6 +12348,7 @@ __metadata:
     "@types/node-fetch": "npm:^2.6.12"
     "@types/webpack-bundle-analyzer": "npm:^4.7.0"
     "@types/webpack-plugin-serve": "npm:^1.4.6"
+    "@vue/preload-webpack-plugin": "npm:^2.0.0"
     babel-loader: "npm:^9.1.3"
     babel-plugin-styled-components: "npm:^2.1.4"
     copy-webpack-plugin: "npm:^12.0.2"
@@ -14734,6 +14735,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@vue/preload-webpack-plugin@npm:^2.0.0":
+  version: 2.0.0
+  resolution: "@vue/preload-webpack-plugin@npm:2.0.0"
+  peerDependencies:
+    html-webpack-plugin: ^5.0.0 || ^4.5.1
+    webpack: ^5.20.0 || ^4.1.0
+  checksum: 10/ddaf1542b2cdece5619eb836c96cc177153b8b1a55833d279358d7042d869e916b461e0fc7e8372504a479b8b8c135885b10738bb9a241c5ae542099deef6341
+  languageName: node
+  linkType: hard
+
 "@vue/shared@npm:3.4.27":
   version: 3.4.27
   resolution: "@vue/shared@npm:3.4.27"