perf: split shared Vue/@nextcloud/vue chunks (~47 MB -> ~24 MB widget JS)

lib/Dashboard/CasesOverviewWidget.php

@@ -117,6 +117,9 @@ public function getUrl(): ?string
      */
     public function load(): void
     {
+        // Shared vendor chunks emitted by webpack splitChunks (see webpack.config.js).
+        Util::addScript(Application::APP_ID, Application::APP_ID.'-shared-vendor');
+        Util::addScript(Application::APP_ID, Application::APP_ID.'-shared-nc-vue');
         Util::addScript(Application::APP_ID, Application::APP_ID.'-casesOverviewWidget');
         Util::addStyle(Application::APP_ID, 'dashboardWidgets');
 

lib/Dashboard/DeadlineAlertsWidget.php

@@ -118,6 +118,9 @@ public function getUrl(): ?string
      */
     public function load(): void
     {
+        // Shared vendor chunks emitted by webpack splitChunks (see webpack.config.js).
+        Util::addScript(Application::APP_ID, Application::APP_ID.'-shared-vendor');
+        Util::addScript(Application::APP_ID, Application::APP_ID.'-shared-nc-vue');
         Util::addScript(Application::APP_ID, Application::APP_ID.'-deadlineAlertsWidget');
         Util::addStyle(Application::APP_ID, 'dashboardWidgets');
 

lib/Dashboard/MyTasksWidget.php

@@ -117,6 +117,9 @@ public function getUrl(): ?string
      */
     public function load(): void
     {
+        // Shared vendor chunks emitted by webpack splitChunks (see webpack.config.js).
+        Util::addScript(Application::APP_ID, Application::APP_ID.'-shared-vendor');
+        Util::addScript(Application::APP_ID, Application::APP_ID.'-shared-nc-vue');
         Util::addScript(Application::APP_ID, Application::APP_ID.'-myTasksWidget');
         Util::addStyle(Application::APP_ID, 'dashboardWidgets');
 

lib/Dashboard/OverdueCasesWidget.php

@@ -117,6 +117,9 @@ public function getUrl(): ?string
      */
     public function load(): void
     {
+        // Shared vendor chunks emitted by webpack splitChunks (see webpack.config.js).
+        Util::addScript(Application::APP_ID, Application::APP_ID.'-shared-vendor');
+        Util::addScript(Application::APP_ID, Application::APP_ID.'-shared-nc-vue');
         Util::addScript(Application::APP_ID, Application::APP_ID.'-overdueCasesWidget');
         Util::addStyle(Application::APP_ID, 'dashboardWidgets');
 

lib/Dashboard/StalledCasesWidget.php

@@ -118,6 +118,9 @@ public function getUrl(): ?string
      */
     public function load(): void
     {
+        // Shared vendor chunks emitted by webpack splitChunks (see webpack.config.js).
+        Util::addScript(Application::APP_ID, Application::APP_ID.'-shared-vendor');
+        Util::addScript(Application::APP_ID, Application::APP_ID.'-shared-nc-vue');
         Util::addScript(Application::APP_ID, Application::APP_ID.'-stalledCasesWidget');
         Util::addStyle(Application::APP_ID, 'dashboardWidgets');
 

lib/Dashboard/StartCaseWidget.php

@@ -112,6 +112,9 @@ public function getUrl(): ?string
      */
     public function load(): void
     {
+        // Shared vendor chunks emitted by webpack splitChunks (see webpack.config.js).
+        Util::addScript(Application::APP_ID, Application::APP_ID.'-shared-vendor');
+        Util::addScript(Application::APP_ID, Application::APP_ID.'-shared-nc-vue');
         Util::addScript(Application::APP_ID, Application::APP_ID.'-startCaseWidget');
         Util::addStyle(Application::APP_ID, 'dashboardWidgets');
     }//end load()

lib/Dashboard/TaskRemindersWidget.php

@@ -118,6 +118,9 @@ public function getUrl(): ?string
      */
     public function load(): void
     {
+        // Shared vendor chunks emitted by webpack splitChunks (see webpack.config.js).
+        Util::addScript(Application::APP_ID, Application::APP_ID.'-shared-vendor');
+        Util::addScript(Application::APP_ID, Application::APP_ID.'-shared-nc-vue');
         Util::addScript(Application::APP_ID, Application::APP_ID.'-taskRemindersWidget');
         Util::addStyle(Application::APP_ID, 'dashboardWidgets');
 

webpack.config.js

@@ -101,4 +101,41 @@ webpackConfig.plugins = [
 // preventing the nextcloud-vue submodule's nested deps (Vue 3) from leaking in.
 webpackConfig.resolve.alias['@nextcloud/dialogs'] = path.resolve(__dirname, 'node_modules/@nextcloud/dialogs')
 
+// Share Vue + @nextcloud/vue + pinia + icons + @conduction/nextcloud-vue
+// across every entry-point so each widget bundle no longer inlines its own
+// ~5 MB framework copy. Stable filenames (no contenthash in the JS name)
+// mean each widget's `Util::addScript` PHP call can reference the chunk
+// directly without a manifest. The vendor chunk is loaded once and cached
+// across every widget/page in the app.
+webpackConfig.optimization = {
+	...(webpackConfig.optimization || {}),
+	splitChunks: {
+		...(webpackConfig.optimization?.splitChunks || {}),
+		chunks: 'all',
+		cacheGroups: {
+			default: false,
+			defaultVendors: false,
+			ncVue: {
+				name: appId + '-shared-nc-vue',
+				// Matches both node_modules entries AND the monorepo-dev alias
+				// `../nextcloud-vue/src/...` which webpack resolves outside
+				// node_modules when @conduction/nextcloud-vue is aliased to it.
+				test: /[\\/]node_modules[\\/](@nextcloud[\\/]vue|@conduction[\\/]nextcloud-vue)[\\/]|[\\/]nextcloud-vue[\\/]src[\\/]/,
+				priority: 30,
+				reuseExistingChunk: true,
+				enforce: true,
+				filename: appId + '-shared-nc-vue.js',
+			},
+			vendor: {
+				name: appId + '-shared-vendor',
+				test: /[\\/]node_modules[\\/](vue|pinia|vue-material-design-icons|@vueuse|core-js)[\\/]/,
+				priority: 20,
+				reuseExistingChunk: true,
+				enforce: true,
+				filename: appId + '-shared-vendor.js',
+			},
+		},
+	},
+}
+
 module.exports = webpackConfig