From 9ca2dffff46c690b02c6b6e132b8937fa030ced7 Mon Sep 17 00:00:00 2001 From: Eliot Berriot <contact@eliotberriot.com> Date: Thu, 6 Jun 2019 16:03:52 +0200 Subject: [PATCH] Faster loading of retribute profiles --- src/components/Suggestions.vue | 52 +++++++++++++++++++++------------- src/sources/mastodon.js | 2 +- 2 files changed, 33 insertions(+), 21 deletions(-) diff --git a/src/components/Suggestions.vue b/src/components/Suggestions.vue index a24886a..5f4f169 100644 --- a/src/components/Suggestions.vue +++ b/src/components/Suggestions.vue @@ -5,7 +5,7 @@ <router-link to="/connect" class="secondary-content">Add another account</router-link> <h5>Connected accounts</h5> </li> - <li class="collection-item avatar" v-for="account in accounts" :key="account.id"> + <li class="collection-item avatar" v-for="account in accounts" :key="account.fullId"> <img v-if="account._source.getAvatar(account)" :src="account._source.getAvatar(account)" alt="" class="circle"> <span class="title">{{ account._source.getDisplayName(account) }}</span> <p>{{ account._source.label }}</p> @@ -26,16 +26,6 @@ :class="['waves-effect', 'waves-light', {disabled: isLoading}, 'btn-small']" :disabled="isLoading"> <i class="material-icons left">refresh</i>Fetch data </button> - <button - @click="lookupAll()" - :class="['waves-effect', 'waves-light', 'btn-small', 'grey lighten-5', 'text-blue-grey darken-4']"> - <i class="material-icons left">eye</i>Retribute lookup - </button> - <button - @click="clearCache()" - :class="['waves-effect', 'waves-light', 'btn-small', 'grey lighten-5', 'text-blue-grey darken-4']"> - <i class="material-icons left">clear</i>Clear cache - </button> </h2> <div v-if="isLoading" class="progress"> <div class="indeterminate"></div> @@ -52,7 +42,7 @@ <template v-for="mean in retributeProfiles[suggestion.fullId].means"> <a :href="mean.url" - :key="mean.id" + :key="mean.provider + mean.id" target="_blank" rel="noopener noreferrer" :class="['waves-effect', 'waves-light', 'btn-small']"> @@ -71,6 +61,7 @@ <script> import sources from '@/sources' import orderBy from 'lodash/orderBy' +import pull from 'lodash/pull' import chunk from 'lodash/chunk' import axios from 'axios' @@ -81,6 +72,7 @@ export default { results: {}, aggregatedSuggestions: this.$store.state.cache.aggregatedSuggestions || {}, retributeProfiles: this.$store.state.cache.retributeProfiles || {}, + loadingRetributeProfiles: [], } }, computed: { @@ -93,6 +85,11 @@ export default { filteredSuggestions () { return orderBy(Object.values(this.aggregatedSuggestions), ['weight', 'id'], ['desc', 'asc']) }, + missingRetributeProfiles () { + return this.filteredSuggestions.filter((s) => { + return this.retributeProfiles[s.fullId] === undefined + }) + } }, methods: { clearCache () { @@ -100,6 +97,7 @@ export default { this.results = {} this.aggregatedSuggestions = {} this.retributeProfiles = {} + this.loadingRetributeProfiles = {} }, aggregateSuggestions (results) { const aggregated = {} @@ -128,6 +126,8 @@ export default { }) } else { accounts = this.accounts + this.retributeProfiles = {} + this.loadingRetributeProfiles = [] } this.isLoading = true accounts.forEach((a) => { @@ -139,16 +139,20 @@ export default { for(let i = 0; i < keys.length; i++){ await this.results[keys[i]].promise } - await this.lookupAll() this.isLoading = false }, async lookupAll () { - this.retributeProfiles = {} - const toLookup = this.filteredSuggestions.filter((s) => { - return this.retributeProfiles[s.fullId] === undefined - }) + this.isLoading = true const chunkSize = 10 - const chunks = chunk(toLookup, chunkSize) + let self = this + const toLoad = this.missingRetributeProfiles.filter((p) => { + return self.loadingRetributeProfiles.indexOf(p.fullId) === -1 + }) + // lock + toLoad.forEach((p) => { + self.loadingRetributeProfiles.push(p.fullId) + }) + const chunks = chunk(toLoad, chunkSize) for (let i = 0; i < chunks.length; i++){ let chunk = chunks[i] let ids = chunk.map((s) => { @@ -156,12 +160,16 @@ export default { }) await this.lookups(ids) } + this.isLoading = false }, async lookups(ids) { + let self = this + ids.forEach((id) => { + self.loadingRetributeProfiles.push(id) + }) const client = axios.create() let url = `http://localhost:8000/api/v1/search/` - let self = this let response try { response = await client.post(url, {lookups: ids}) @@ -177,6 +185,7 @@ export default { }, async lookup (id) { + this.loadingRetributeProfiles.push(id) const client = axios.create() let url = `http://localhost:8000/api/v1/search/${id}` try { @@ -184,11 +193,14 @@ export default { this.$set(this.retributeProfiles, id, response.data) } catch { this.$set(this.retributeProfiles, id, null) - return } + pull(this.loadingRetributeProfiles, [id]) } }, watch: { + async missingRetributeProfiles (v) { + await this.lookupAll() + }, results: { handler (v) { this.aggregatedSuggestions = this.aggregateSuggestions(v) diff --git a/src/sources/mastodon.js b/src/sources/mastodon.js index b48cc20..3d7a4e3 100644 --- a/src/sources/mastodon.js +++ b/src/sources/mastodon.js @@ -89,7 +89,7 @@ export default { baseURL: `https://${account.domain}`, headers: {'Authorization': `Bearer ${token}`}, }) - const maxFavorites = 120 + const maxFavorites = 400 let url = '/api/v1/favourites' let handledFavorites = 0 results.progress = 0 -- GitLab