1
1
mirror of https://github.com/go-gitea/gitea synced 2025-07-04 17:47:19 +00:00

Use shallowRef instead of ref in .vue files where possible (#34813)

This PR improves some `.vue` components by using `shallowRef instead of
ref`, which `should improve performance`. It's probably not significant,
but it's an improvement because Vue no longer deep watches the ref
(shallowRef). Also i used `useTemplateRef` instead of `ref`.

---------

Signed-off-by: wxiaoguang <wxiaoguang@gmail.com>
Co-authored-by: wxiaoguang <wxiaoguang@gmail.com>
This commit is contained in:
Kilisei
2025-06-22 15:37:03 +02:00
committed by GitHub
parent a46b16f10f
commit 181db69e0c
9 changed files with 51 additions and 51 deletions

View File

@ -1,9 +1,9 @@
<script lang="ts" setup>
// @ts-expect-error - module exports no types
import {VueBarGraph} from 'vue-bar-graph';
import {computed, onMounted, ref} from 'vue';
import {computed, onMounted, shallowRef, useTemplateRef} from 'vue';
const colors = ref({
const colors = shallowRef({
barColor: 'green',
textColor: 'black',
textAltColor: 'white',
@ -41,8 +41,8 @@ const graphWidth = computed(() => {
return activityTopAuthors.length * 40;
});
const styleElement = ref<HTMLElement | null>(null);
const altStyleElement = ref<HTMLElement | null>(null);
const styleElement = useTemplateRef('styleElement');
const altStyleElement = useTemplateRef('altStyleElement');
onMounted(() => {
const refStyle = window.getComputedStyle(styleElement.value);