From 2a6d1110d86311ccbd3d0742cd5bfc491f2f5d5d Mon Sep 17 00:00:00 2001
From: Julius Knorr <jus@bitgrid.net>
Date: Wed, 12 Nov 2025 08:42:48 +0100
Subject: [PATCH 1/2] perf: Use individual component imports to reduce bundle
 size and build time

Signed-off-by: Julius Knorr <jus@bitgrid.net>
---
 src/App.vue                           | 12 +++++-------
 src/components/AppSettings.vue        | 24 +++++++++++-------------
 src/components/CategoriesList.vue     |  8 +++-----
 src/components/CreateSampleButton.vue |  4 +---
 src/components/Dashboard.vue          |  4 +++-
 src/components/EditorEasyMDE.vue      |  6 ++----
 src/components/HelpMobile.vue         |  2 +-
 src/components/Loading.vue            |  4 +---
 src/components/Modal/EditorHint.vue   |  3 ++-
 src/components/NoteItem.vue           |  5 ++++-
 src/components/NotePlain.vue          | 22 ++++++++++++----------
 src/components/NoteRich.vue           | 12 +++++++-----
 src/components/NotesView.vue          | 12 +++++-------
 src/components/Welcome.vue            |  6 ++----
 14 files changed, 59 insertions(+), 65 deletions(-)

diff --git a/src/App.vue b/src/App.vue
index 12a0b36c3..31a8eff99 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -46,13 +46,11 @@
 </template>
 
 <script>
-import {
-	NcAppContent,
-	NcAppNavigation,
-	NcAppNavigationNew,
-	NcAppNavigationItem,
-	NcContent,
-} from '@nextcloud/vue'
+import NcAppContent from '@nextcloud/vue/components/NcAppContent'
+import NcAppNavigation from '@nextcloud/vue/components/NcAppNavigation'
+import NcAppNavigationNew from '@nextcloud/vue/components/NcAppNavigationNew'
+import NcAppNavigationItem from '@nextcloud/vue/components/NcAppNavigationItem'
+import NcContent from '@nextcloud/vue/components/NcContent'
 import { loadState } from '@nextcloud/initial-state'
 import { showSuccess, TOAST_UNDO_TIMEOUT, TOAST_PERMANENT_TIMEOUT } from '@nextcloud/dialogs'
 import '@nextcloud/dialogs/style.css'
diff --git a/src/components/AppSettings.vue b/src/components/AppSettings.vue
index 3dc7fa110..02930c487 100644
--- a/src/components/AppSettings.vue
+++ b/src/components/AppSettings.vue
@@ -86,19 +86,17 @@
 </template>
 
 <script>
-import {
-	NcAppSettingsDialog,
-	NcAppSettingsSection,
-	NcAppSettingsShortcutsSection,
-	NcHotkeyList,
-	NcHotkey,
-	NcRadioGroup,
-	NcRadioGroupButton,
-	NcFormBox,
-	NcFormBoxButton,
-	NcFormGroup,
-	NcTextField,
-} from '@nextcloud/vue'
+import NcAppSettingsDialog from '@nextcloud/vue/components/NcAppSettingsDialog'
+import NcAppSettingsSection from '@nextcloud/vue/components/NcAppSettingsSection'
+import NcAppSettingsShortcutsSection from '@nextcloud/vue/components/NcAppSettingsShortcutsSection'
+import NcHotkeyList from '@nextcloud/vue/components/NcHotkeyList'
+import NcHotkey from '@nextcloud/vue/components/NcHotkey'
+import NcRadioGroup from '@nextcloud/vue/components/NcRadioGroup'
+import NcRadioGroupButton from '@nextcloud/vue/components/NcRadioGroupButton'
+import NcFormBox from '@nextcloud/vue/components/NcFormBox'
+import NcFormBoxButton from '@nextcloud/vue/components/NcFormBoxButton'
+import NcFormGroup from '@nextcloud/vue/components/NcFormGroup'
+import NcTextField from '@nextcloud/vue/components/NcTextField'
 
 import { getFilePickerBuilder } from '@nextcloud/dialogs'
 
diff --git a/src/components/CategoriesList.vue b/src/components/CategoriesList.vue
index 94cbaa9c8..37e875697 100644
--- a/src/components/CategoriesList.vue
+++ b/src/components/CategoriesList.vue
@@ -43,11 +43,9 @@
 </template>
 
 <script>
-import {
-	NcAppNavigationItem,
-	NcAppNavigationCaption,
-	NcCounterBubble,
-} from '@nextcloud/vue'
+import NcAppNavigationItem from '@nextcloud/vue/components/NcAppNavigationItem'
+import NcAppNavigationCaption from '@nextcloud/vue/components/NcAppNavigationCaption'
+import NcCounterBubble from '@nextcloud/vue/components/NcCounterBubble'
 import { Fragment } from 'vue-frag'
 
 import FolderIcon from 'vue-material-design-icons/Folder.vue'
diff --git a/src/components/CreateSampleButton.vue b/src/components/CreateSampleButton.vue
index 0cd63608d..a0a09a694 100644
--- a/src/components/CreateSampleButton.vue
+++ b/src/components/CreateSampleButton.vue
@@ -11,9 +11,7 @@
 </template>
 <script>
 
-import {
-	NcButton,
-} from '@nextcloud/vue'
+import NcButton from '@nextcloud/vue/components/NcButton'
 
 import Plus from 'vue-material-design-icons/Plus.vue'
 
diff --git a/src/components/Dashboard.vue b/src/components/Dashboard.vue
index b2fba3cc1..91a3abf06 100644
--- a/src/components/Dashboard.vue
+++ b/src/components/Dashboard.vue
@@ -34,7 +34,9 @@
 </template>
 
 <script>
-import { NcButton, NcDashboardWidget, NcDashboardWidgetItem } from '@nextcloud/vue'
+import NcButton from '@nextcloud/vue/components/NcButton'
+import NcDashboardWidget from '@nextcloud/vue/components/NcDashboardWidget'
+import NcDashboardWidgetItem from '@nextcloud/vue/components/NcDashboardWidgetItem'
 import { generateUrl } from '@nextcloud/router'
 
 import Plus from 'vue-material-design-icons/Plus.vue'
diff --git a/src/components/EditorEasyMDE.vue b/src/components/EditorEasyMDE.vue
index 50c9fbe1c..31015f718 100644
--- a/src/components/EditorEasyMDE.vue
+++ b/src/components/EditorEasyMDE.vue
@@ -39,10 +39,8 @@ import axios from '@nextcloud/axios'
 import { generateUrl } from '@nextcloud/router'
 import { showError } from '@nextcloud/dialogs'
 import '@nextcloud/dialogs/style.css'
-import {
-	NcActions,
-	NcActionButton,
-} from '@nextcloud/vue'
+import NcActions from '@nextcloud/vue/components/NcActions'
+import NcActionButton from '@nextcloud/vue/components/NcActionButton'
 import { basename, relative } from 'path'
 
 import store from '../store.js'
diff --git a/src/components/HelpMobile.vue b/src/components/HelpMobile.vue
index 93b4b67a6..2b0c88aba 100644
--- a/src/components/HelpMobile.vue
+++ b/src/components/HelpMobile.vue
@@ -42,7 +42,7 @@
 import { generateFilePath } from '@nextcloud/router'
 
 import { Fragment } from 'vue-frag'
-import { NcFormGroup } from '@nextcloud/vue'
+import NcFormGroup from '@nextcloud/vue/components/NcFormGroup'
 
 export default {
 	components: {
diff --git a/src/components/Loading.vue b/src/components/Loading.vue
index 1b072c9d4..58088bc59 100644
--- a/src/components/Loading.vue
+++ b/src/components/Loading.vue
@@ -8,9 +8,7 @@
 </template>
 <script>
 
-import {
-	NcAppContent,
-} from '@nextcloud/vue'
+import NcAppContent from '@nextcloud/vue/components/NcAppContent'
 
 export default {
 	name: 'Loading',
diff --git a/src/components/Modal/EditorHint.vue b/src/components/Modal/EditorHint.vue
index 13c79223b..c012c6856 100644
--- a/src/components/Modal/EditorHint.vue
+++ b/src/components/Modal/EditorHint.vue
@@ -24,7 +24,8 @@
 	</NcModal>
 </template>
 <script>
-import { NcModal, NcButton } from '@nextcloud/vue'
+import NcModal from '@nextcloud/vue/components/NcModal'
+import NcButton from '@nextcloud/vue/components/NcButton'
 import { loadState } from '@nextcloud/initial-state'
 
 import { deleteEditorMode, setSettings } from './../../NotesService.js'
diff --git a/src/components/NoteItem.vue b/src/components/NoteItem.vue
index 89e981e74..7a755a1c0 100644
--- a/src/components/NoteItem.vue
+++ b/src/components/NoteItem.vue
@@ -100,7 +100,10 @@
 </template>
 
 <script>
-import { NcListItem, NcActionButton, NcActionSeparator, NcActionInput } from '@nextcloud/vue'
+import NcListItem from '@nextcloud/vue/components/NcListItem'
+import NcActionButton from '@nextcloud/vue/components/NcActionButton'
+import NcActionSeparator from '@nextcloud/vue/components/NcActionSeparator'
+import NcActionInput from '@nextcloud/vue/components/NcActionInput'
 import AlertOctagonOutlineIcon from 'vue-material-design-icons/AlertOctagonOutline.vue'
 import FileDocumentOutlineIcon from 'vue-material-design-icons/FileDocumentOutline.vue'
 import FolderOutlineIcon from 'vue-material-design-icons/FolderOutline.vue'
diff --git a/src/components/NotePlain.vue b/src/components/NotePlain.vue
index 35795688a..0fe587c12 100644
--- a/src/components/NotePlain.vue
+++ b/src/components/NotePlain.vue
@@ -92,14 +92,12 @@
 </template>
 <script>
 
-import {
-	NcActions,
-	NcActionButton,
-	NcAppContent,
-	NcModal,
-	Tooltip,
-	isMobile,
-} from '@nextcloud/vue'
+import NcActions from '@nextcloud/vue/components/NcActions'
+import NcActionButton from '@nextcloud/vue/components/NcActionButton'
+import NcAppContent from '@nextcloud/vue/components/NcAppContent'
+import NcModal from '@nextcloud/vue/components/NcModal'
+import Tooltip from '@nextcloud/vue/directives/Tooltip'
+import { useIsMobile } from '@nextcloud/vue/composables/useIsMobile'
 import { showError } from '@nextcloud/dialogs'
 import { emit, subscribe, unsubscribe } from '@nextcloud/event-bus'
 
@@ -139,8 +137,6 @@ export default {
 		tooltip: Tooltip,
 	},
 
-	mixins: [isMobile],
-
 	props: {
 		noteId: {
 			type: String,
@@ -148,6 +144,12 @@ export default {
 		},
 	},
 
+	setup() {
+		return {
+			isMobile: useIsMobile(),
+		}
+	},
+
 	data() {
 		return {
 			loading: false,
diff --git a/src/components/NoteRich.vue b/src/components/NoteRich.vue
index 912529587..846c0779f 100644
--- a/src/components/NoteRich.vue
+++ b/src/components/NoteRich.vue
@@ -10,9 +10,7 @@
 </template>
 <script>
 
-import {
-	isMobile,
-} from '@nextcloud/vue'
+import { useIsMobile } from '@nextcloud/vue/composables/useIsMobile'
 import { emit, subscribe, unsubscribe } from '@nextcloud/event-bus'
 
 import { queueCommand, refreshNote } from '../NotesService.js'
@@ -22,8 +20,6 @@ import store from '../store.js'
 export default {
 	name: 'NoteRich',
 
-	mixins: [isMobile],
-
 	props: {
 		noteId: {
 			type: String,
@@ -31,6 +27,12 @@ export default {
 		},
 	},
 
+	setup() {
+		return {
+			isMobile: useIsMobile(),
+		}
+	},
+
 	data() {
 		return {
 			loading: false,
diff --git a/src/components/NotesView.vue b/src/components/NotesView.vue
index f4b5dbe04..1c14cb9ee 100644
--- a/src/components/NotesView.vue
+++ b/src/components/NotesView.vue
@@ -60,13 +60,11 @@
 
 <script>
 
-import {
-	NcAppContent,
-	NcAppContentList,
-	NcAppContentDetails,
-	NcButton,
-	NcTextField,
-} from '@nextcloud/vue'
+import NcAppContent from '@nextcloud/vue/components/NcAppContent'
+import NcAppContentList from '@nextcloud/vue/components/NcAppContentList'
+import NcAppContentDetails from '@nextcloud/vue/components/NcAppContentDetails'
+import NcButton from '@nextcloud/vue/components/NcButton'
+import NcTextField from '@nextcloud/vue/components/NcTextField'
 import { categoryLabel } from '../Util.js'
 import NotesList from './NotesList.vue'
 import NotesCaption from './NotesCaption.vue'
diff --git a/src/components/Welcome.vue b/src/components/Welcome.vue
index 2ec522f9e..61f920d99 100644
--- a/src/components/Welcome.vue
+++ b/src/components/Welcome.vue
@@ -34,10 +34,8 @@
 </template>
 <script>
 
-import {
-	NcAppContent,
-	NcButton,
-} from '@nextcloud/vue'
+import NcAppContent from '@nextcloud/vue/components/NcAppContent'
+import NcButton from '@nextcloud/vue/components/NcButton'
 
 import Plus from 'vue-material-design-icons/Plus.vue'
 

From 6031c3d7593a94130d41b54de16920b2802b4e70 Mon Sep 17 00:00:00 2001
From: Julius Knorr <jus@bitgrid.net>
Date: Wed, 12 Nov 2025 11:44:51 +0100
Subject: [PATCH 2/2] chore: Remove manual split group

Signed-off-by: Julius Knorr <jus@bitgrid.net>
---
 webpack.config.js | 10 ----------
 1 file changed, 10 deletions(-)

diff --git a/webpack.config.js b/webpack.config.js
index 268d26c99..5e8f411a1 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -8,14 +8,4 @@ const path = require('path')
 
 webpackConfig.entry.dashboard = path.join(__dirname, 'src', 'dashboard.js')
 
-webpackConfig.optimization = {
-	splitChunks: {
-		cacheGroups: {
-			defaultVendors: {
-				name: 'commons',
-			}
-		},
-	},
-}
-
 module.exports = webpackConfig