From c4830dcf3a7bad6f1c90b453b012712ea1e40908 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Sat, 6 Aug 2022 19:20:53 +0900
Subject: [PATCH] perf(client): use shallowRef as possible
---
packages/client/src/components/analog-clock.vue | 9 +++++----
packages/client/src/components/global/time.vue | 2 +-
2 files changed, 6 insertions(+), 5 deletions(-)
diff --git a/packages/client/src/components/analog-clock.vue b/packages/client/src/components/analog-clock.vue
index 170dbb36fa..e960926a15 100644
--- a/packages/client/src/components/analog-clock.vue
+++ b/packages/client/src/components/analog-clock.vue
@@ -59,7 +59,7 @@
</template>
<script lang="ts" setup>
-import { ref, computed, onMounted, onBeforeUnmount } from 'vue';
+import { ref, computed, onMounted, onBeforeUnmount, shallowRef } from 'vue';
import tinycolor from 'tinycolor2';
import { globalEvents } from '@/events.js';
@@ -112,7 +112,7 @@ const texts = computed(() => {
return angles;
});
-const now = ref(new Date());
+const now = shallowRef(new Date());
now.value.setMinutes(now.value.getMinutes() + (new Date().getTimezoneOffset() + props.offset));
const enabled = ref(true);
@@ -130,8 +130,9 @@ const mAngle = computed(() => Math.PI * (m.value + s.value / 60) / 30);
const sAngle = computed(() => Math.PI * s.value / 30);
function tick() {
- now.value = new Date();
- now.value.setMinutes(now.value.getMinutes() + (new Date().getTimezoneOffset() + props.offset));
+ const date = new Date();
+ date.setMinutes(now.value.getMinutes() + (new Date().getTimezoneOffset() + props.offset));
+ now.value = date;
}
function calcColors() {
diff --git a/packages/client/src/components/global/time.vue b/packages/client/src/components/global/time.vue
index 801490225b..f72b153f56 100644
--- a/packages/client/src/components/global/time.vue
+++ b/packages/client/src/components/global/time.vue
@@ -20,7 +20,7 @@ const props = withDefaults(defineProps<{
const _time = typeof props.time === 'string' ? new Date(props.time) : props.time;
const absolute = _time.toLocaleString();
-let now = $ref(new Date());
+let now = $shallowRef(new Date());
const relative = $computed(() => {
const ago = (now.getTime() - _time.getTime()) / 1000/*ms*/;
return (
--
GitLab