perf(client): use shallowRef as possible
This commit is contained in:
		
							parent
							
								
									cb35ace047
								
							
						
					
					
						commit
						c4830dcf3a
					
				
					 2 changed files with 6 additions and 5 deletions
				
			
		|  | @ -59,7 +59,7 @@ | ||||||
| </template> | </template> | ||||||
| 
 | 
 | ||||||
| <script lang="ts" setup> | <script lang="ts" setup> | ||||||
| import { ref, computed, onMounted, onBeforeUnmount } from 'vue'; | import { ref, computed, onMounted, onBeforeUnmount, shallowRef } from 'vue'; | ||||||
| import tinycolor from 'tinycolor2'; | import tinycolor from 'tinycolor2'; | ||||||
| import { globalEvents } from '@/events.js'; | import { globalEvents } from '@/events.js'; | ||||||
| 
 | 
 | ||||||
|  | @ -112,7 +112,7 @@ const texts = computed(() => { | ||||||
| 	return angles; | 	return angles; | ||||||
| }); | }); | ||||||
| 
 | 
 | ||||||
| const now = ref(new Date()); | const now = shallowRef(new Date()); | ||||||
| now.value.setMinutes(now.value.getMinutes() + (new Date().getTimezoneOffset() + props.offset)); | now.value.setMinutes(now.value.getMinutes() + (new Date().getTimezoneOffset() + props.offset)); | ||||||
| 
 | 
 | ||||||
| const enabled = ref(true); | 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); | const sAngle = computed(() => Math.PI * s.value / 30); | ||||||
| 
 | 
 | ||||||
| function tick() { | function tick() { | ||||||
| 	now.value = new Date(); | 	const date = new Date(); | ||||||
| 	now.value.setMinutes(now.value.getMinutes() + (new Date().getTimezoneOffset() + props.offset)); | 	date.setMinutes(now.value.getMinutes() + (new Date().getTimezoneOffset() + props.offset)); | ||||||
|  | 	now.value = date; | ||||||
| } | } | ||||||
| 
 | 
 | ||||||
| function calcColors() { | function calcColors() { | ||||||
|  |  | ||||||
|  | @ -20,7 +20,7 @@ const props = withDefaults(defineProps<{ | ||||||
| const _time = typeof props.time === 'string' ? new Date(props.time) : props.time; | const _time = typeof props.time === 'string' ? new Date(props.time) : props.time; | ||||||
| const absolute = _time.toLocaleString(); | const absolute = _time.toLocaleString(); | ||||||
| 
 | 
 | ||||||
| let now = $ref(new Date()); | let now = $shallowRef(new Date()); | ||||||
| const relative = $computed(() => { | const relative = $computed(() => { | ||||||
| 	const ago = (now.getTime() - _time.getTime()) / 1000/*ms*/; | 	const ago = (now.getTime() - _time.getTime()) / 1000/*ms*/; | ||||||
| 	return ( | 	return ( | ||||||
|  |  | ||||||
		Loading…
	
	Add table
		Add a link
		
	
		Reference in a new issue