From 3870f47142cc62e80f51d2a719a800e5dca62165 Mon Sep 17 00:00:00 2001 From: Jannik Stehle Date: Tue, 15 Mar 2022 13:20:25 +0100 Subject: [PATCH 1/2] Improve resource loading within spaces --- ...enhancement-improve-space-resource-loading | 8 +++++ .../src/services/folder/loaderProject.ts | 36 ++++++++++++------- .../src/views/spaces/Project.vue | 4 +-- 3 files changed, 33 insertions(+), 15 deletions(-) create mode 100644 changelog/unreleased/enhancement-improve-space-resource-loading diff --git a/changelog/unreleased/enhancement-improve-space-resource-loading b/changelog/unreleased/enhancement-improve-space-resource-loading new file mode 100644 index 00000000000..1b25548faa7 --- /dev/null +++ b/changelog/unreleased/enhancement-improve-space-resource-loading @@ -0,0 +1,8 @@ +Enhancement: Improve resource loading within spaces + +We've improved the loading of resources within a space. This enhances performance and overall stability within spaces. + +* A new parameter was introduced to determine if a space needs to be fetched or not. Route changes within a space do not require the space the be fetched again. This also ensures that the space image and readme won't be fetched in subfolders. +* The space now gets set at the end of the loading task. This ensures that the space task has finished as soon as the image and readme get loaded. + +https://github.com/owncloud/web/pull/6601 diff --git a/packages/web-app-files/src/services/folder/loaderProject.ts b/packages/web-app-files/src/services/folder/loaderProject.ts index 2a9f03d68b3..7981ddcb9ce 100644 --- a/packages/web-app-files/src/services/folder/loaderProject.ts +++ b/packages/web-app-files/src/services/folder/loaderProject.ts @@ -14,21 +14,27 @@ export class FolderLoaderProject implements FolderLoader { const router = context.router const store = context.store - const graphClient = clientService.graphAuthenticated( - store.getters.configuration.server, - store.getters.getToken - ) - - return useTask(function* (signal1, signal2, ref, sameRoute, path = null) { + return useTask(function* (signal1, signal2, ref, sameRoute, path = null, fetchSpace = true) { ref.CLEAR_CURRENT_FILES_LIST() - const storageId = router.currentRoute.params.storageId - const graphResponse = yield graphClient.drives.getDrive(storageId) - if (!graphResponse.data) { - return - } + let space + if (fetchSpace) { + const graphClient = clientService.graphAuthenticated( + store.getters.configuration.server, + store.getters.getToken + ) + + const storageId = router.currentRoute.params.storageId + const graphResponse = yield graphClient.drives.getDrive(storageId) + + if (!graphResponse.data) { + return + } - ref.space = buildSpace(graphResponse.data) + space = buildSpace(graphResponse.data) + } else { + space = ref.space + } const webDavResponse = yield ref.$client.files.list( buildWebDavSpacesPath(ref.$route.params.storageId, path || '') @@ -37,7 +43,7 @@ export class FolderLoaderProject implements FolderLoader { let resources = [] if (!path) { // space front page -> use space as current folder - resources.push(ref.space) + resources.push(space) const webDavResources = webDavResponse.map(buildResource) webDavResources.shift() // Remove webdav entry for the space itself @@ -56,6 +62,10 @@ export class FolderLoaderProject implements FolderLoader { client: ref.$client, currentFolder: currentFolder?.path }) + + if (fetchSpace) { + ref.space = space + } }) } } diff --git a/packages/web-app-files/src/views/spaces/Project.vue b/packages/web-app-files/src/views/spaces/Project.vue index ec398e04234..b92440fd3ff 100644 --- a/packages/web-app-files/src/views/spaces/Project.vue +++ b/packages/web-app-files/src/views/spaces/Project.vue @@ -288,12 +288,12 @@ export default { }, watch: { $route: { - handler: function (to, from) { + handler: async function (to, from) { const sameRoute = to.name === from?.name const sameItem = to.params?.item === from?.params?.item if ((!sameRoute || !sameItem) && from) { - this.loadResourcesTask.perform(this, sameRoute, to.params.item) + await this.loadResourcesTask.perform(this, sameRoute, to.params.item, false) } if (this.$refs.markdownContainer) { From 8b5850e235e4e3b46460e6dee154645511824c2c Mon Sep 17 00:00:00 2001 From: Jannik Stehle Date: Thu, 17 Mar 2022 12:58:03 +0100 Subject: [PATCH 2/2] Re-use 'sameRoute' param instead of introducing a new one --- .../unreleased/enhancement-improve-space-resource-loading | 2 +- packages/web-app-files/src/services/folder/loaderProject.ts | 6 +++--- packages/web-app-files/src/views/spaces/Project.vue | 4 ++-- 3 files changed, 6 insertions(+), 6 deletions(-) diff --git a/changelog/unreleased/enhancement-improve-space-resource-loading b/changelog/unreleased/enhancement-improve-space-resource-loading index 1b25548faa7..7e87ec4450e 100644 --- a/changelog/unreleased/enhancement-improve-space-resource-loading +++ b/changelog/unreleased/enhancement-improve-space-resource-loading @@ -2,7 +2,7 @@ Enhancement: Improve resource loading within spaces We've improved the loading of resources within a space. This enhances performance and overall stability within spaces. -* A new parameter was introduced to determine if a space needs to be fetched or not. Route changes within a space do not require the space the be fetched again. This also ensures that the space image and readme won't be fetched in subfolders. +* The loading task will determine if a space needs to be fetched or not. Route changes within a space do not require the space the be fetched again. This also ensures that the space image and readme won't be fetched when navigating into subfolders. * The space now gets set at the end of the loading task. This ensures that the space task has finished as soon as the image and readme get loaded. https://github.com/owncloud/web/pull/6601 diff --git a/packages/web-app-files/src/services/folder/loaderProject.ts b/packages/web-app-files/src/services/folder/loaderProject.ts index 7981ddcb9ce..63f2de369a4 100644 --- a/packages/web-app-files/src/services/folder/loaderProject.ts +++ b/packages/web-app-files/src/services/folder/loaderProject.ts @@ -14,11 +14,11 @@ export class FolderLoaderProject implements FolderLoader { const router = context.router const store = context.store - return useTask(function* (signal1, signal2, ref, sameRoute, path = null, fetchSpace = true) { + return useTask(function* (signal1, signal2, ref, sameRoute, path = null) { ref.CLEAR_CURRENT_FILES_LIST() let space - if (fetchSpace) { + if (!sameRoute) { const graphClient = clientService.graphAuthenticated( store.getters.configuration.server, store.getters.getToken @@ -63,7 +63,7 @@ export class FolderLoaderProject implements FolderLoader { currentFolder: currentFolder?.path }) - if (fetchSpace) { + if (!sameRoute) { ref.space = space } }) diff --git a/packages/web-app-files/src/views/spaces/Project.vue b/packages/web-app-files/src/views/spaces/Project.vue index b92440fd3ff..6c47e7fbd98 100644 --- a/packages/web-app-files/src/views/spaces/Project.vue +++ b/packages/web-app-files/src/views/spaces/Project.vue @@ -289,11 +289,11 @@ export default { watch: { $route: { handler: async function (to, from) { - const sameRoute = to.name === from?.name + const sameRoute = to.name === from?.name && to.params?.storageId === from?.params?.storageId const sameItem = to.params?.item === from?.params?.item if ((!sameRoute || !sameItem) && from) { - await this.loadResourcesTask.perform(this, sameRoute, to.params.item, false) + await this.loadResourcesTask.perform(this, sameRoute, to.params.item) } if (this.$refs.markdownContainer) {