Skip to content

Commit 1d76fbe

Browse files
johannschopplichjohannschopplich
committed
perf: simplify passing fetch options
1 parent 0e46223 commit 1d76fbe

File tree

2 files changed

+70
-71
lines changed

2 files changed

+70
-71
lines changed

‎src/runtime/composables/useKirbyData.ts‎

Lines changed: 37 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { computed, reactive } from 'vue'
1+
import { computed } from 'vue'
22
import { joinURL } from 'ufo'
33
import { hash } from 'ohash'
44
import type { FetchError } from 'ofetch'
@@ -70,11 +70,16 @@ export function useKirbyData<T = any>(
7070
} = opts
7171

7272
const { kql } = useRuntimeConfig().public
73+
const _language = computed(() => toValue(language))
7374
const _path = computed(() => {
7475
const value = toValue(path).replace(/^\//, '')
75-
return language ? joinURL(toValue(language), value) : value
76+
return _language.value ? joinURL(_language.value, value) : value
7677
})
77-
const _language = computed(() => toValue(language))
78+
const key = computed(() => `$kirby${hash([
79+
_path.value,
80+
query,
81+
method,
82+
])}`)
7883

7984
if (!_path.value || (_language.value && !_path.value.replace(new RegExp(`^${_language.value}/`), '')))
8085
console.warn('[useKirbyData] Empty Kirby path')
@@ -97,35 +102,7 @@ export function useKirbyData<T = any>(
97102
immediate,
98103
}
99104

100-
const _serverFetchOptions = reactive<NitroFetchOptions<string>>({
101-
method: 'POST',
102-
body: {
103-
path: _path,
104-
query,
105-
headers: headersToObject(headers),
106-
method,
107-
body,
108-
cache,
109-
},
110-
})
111-
112-
const _clientFetchOptions: NitroFetchOptions<string> = {
113-
baseURL: kql.url,
114-
query,
115-
headers: {
116-
...headersToObject(headers),
117-
...getAuthHeader(kql),
118-
},
119-
method,
120-
body,
121-
}
122-
123105
let controller: AbortController | undefined
124-
const key = computed(() => `$kirby${hash([
125-
_path.value,
126-
query,
127-
method,
128-
])}`)
129106

130107
return useAsyncData<T, FetchError>(
131108
key.value,
@@ -140,14 +117,37 @@ export function useKirbyData<T = any>(
140117
controller = new AbortController()
141118

142119
try {
143-
const result = (await globalThis.$fetch<T>(
144-
client ? _path.value : getProxyPath(key.value),
145-
{
120+
let result: T | undefined
121+
122+
if (client) {
123+
result = (await globalThis.$fetch<T>(_path.value, {
124+
...fetchOptions,
125+
signal: controller.signal,
126+
baseURL: kql.url,
127+
query,
128+
headers: {
129+
...headersToObject(headers),
130+
...getAuthHeader(kql),
131+
},
132+
method,
133+
body,
134+
})) as T
135+
}
136+
else {
137+
result = (await globalThis.$fetch<T>(getProxyPath(key.value), {
146138
...fetchOptions,
147139
signal: controller.signal,
148-
...(client ? _clientFetchOptions : _serverFetchOptions),
149-
},
150-
)) as T
140+
method: 'POST',
141+
body: {
142+
path: _path,
143+
query,
144+
headers: headersToObject(headers),
145+
method,
146+
body,
147+
cache,
148+
},
149+
})) as T
150+
}
151151

152152
if (cache)
153153
nuxt!.payload.data[key.value] = result

‎src/runtime/composables/useKql.ts‎

Lines changed: 33 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { computed, reactive } from 'vue'
1+
import { computed } from 'vue'
22
import { hash } from 'ohash'
33
import type { FetchError } from 'ofetch'
44
import type { NitroFetchOptions } from 'nitropack'
@@ -66,6 +66,7 @@ export function useKql<
6666
const { kql } = useRuntimeConfig().public
6767
const _query = computed(() => toValue(query))
6868
const _language = computed(() => toValue(language))
69+
const key = computed(() => `$kql${hash([_query.value, _language.value])}`)
6970

7071
if (Object.keys(_query.value).length === 0 || !_query.value.query)
7172
console.error('[useKql] Empty KQL query')
@@ -82,39 +83,14 @@ export function useKql<
8283
watch: watch === false
8384
? []
8485
: [
85-
_query,
86-
_language,
86+
// Key contains query and language
87+
key,
8788
...(watch || []),
8889
],
8990
immediate,
9091
}
9192

92-
const _serverFetchOptions = reactive<NitroFetchOptions<string>>({
93-
method: 'POST',
94-
body: {
95-
query: _query,
96-
cache,
97-
headers: computed(() => ({
98-
...headersToObject(headers),
99-
...(_language.value && { 'X-Language': _language.value }),
100-
})),
101-
},
102-
})
103-
104-
const _clientFetchOptions = reactive<NitroFetchOptions<string>>({
105-
baseURL: kql.url,
106-
method: 'POST',
107-
body: _query,
108-
// @ts-expect-error: Reactive value
109-
headers: computed(() => ({
110-
...headersToObject(headers),
111-
...(_language.value && { 'X-Language': _language.value }),
112-
...getAuthHeader(kql),
113-
})),
114-
})
115-
11693
let controller: AbortController | undefined
117-
const key = computed(() => `$kql${hash([_query.value, _language.value])}`)
11894

11995
return useAsyncData<ResT, FetchError>(
12096
key.value,
@@ -129,14 +105,37 @@ export function useKql<
129105
controller = new AbortController()
130106

131107
try {
132-
const result = (await globalThis.$fetch<ResT>(
133-
client ? kql.prefix : getProxyPath(key.value),
134-
{
108+
let result: ResT | undefined
109+
110+
if (client) {
111+
result = (await globalThis.$fetch<ResT>(kql.prefix, {
112+
...fetchOptions,
113+
signal: controller.signal,
114+
baseURL: kql.url,
115+
method: 'POST',
116+
body: _query,
117+
headers: {
118+
...headersToObject(headers),
119+
...(_language.value && { 'X-Language': _language.value }),
120+
...getAuthHeader(kql),
121+
},
122+
})) as ResT
123+
}
124+
else {
125+
result = (await globalThis.$fetch<ResT>(getProxyPath(key.value), {
135126
...fetchOptions,
136127
signal: controller.signal,
137-
...(client ? _clientFetchOptions : _serverFetchOptions),
138-
},
139-
)) as ResT
128+
method: 'POST',
129+
body: {
130+
query: _query,
131+
cache,
132+
headers: {
133+
...headersToObject(headers),
134+
...(_language.value && { 'X-Language': _language.value }),
135+
},
136+
},
137+
})) as ResT
138+
}
140139

141140
if (cache)
142141
nuxt!.payload.data[key.value] = result

0 commit comments

Comments
 (0)