In this issue, I have curated a few interesting articles and tips to help you in your journey to become a Vue expert.
Have a great week βοΈ
Vue Tip: Delay Loading Appearance of Spinner
Eager delay spinners are not a good user experience as they can make a snappy user interface feel slower. We can provide a better user experience (UX) by delaying spinners to appear only after a perceivable delay.
To achieve this improved UX, you can use AsyncComponent.
Vue provides the defineAsyncComponent function to lazy load components:
defineAsyncComponent accepts a loader function that returns a Promise. The resolve callback should be called if the component has been loaded, and the reject callback to indicate that loading the component has failed.
Now letβs implement the delayed loading spinner by using the advanced options of the defineAsyncComponent function:
This demo simulates a network request to fetch HelloWorld.vue from a server which takes 2 seconds:
The loading component Loading.vue is shown after a delay of 500ms, defined with delay: 500.
βIn this post I argue that integration-vs-unit is a confused, and harmful, distinction. I provide a more useful two-dimensional mental model instead.β
ππ» A collection of (mostly) technical things every software develohttps://zelig880.com/how-to-use-refs-in-vue-3-with-composition-api-and-script-setupper regardless of their skill level or tech stack should know.
ππ» Highly opinionated and not backed by science. Comes in no particular order.
