fix: only avoid scrollbar motion for prefers-reduced-motion (#1750)

After thinking about it, I do not believe the scrollbar is that distracting. But for prefers-reduced-motion we should be careful about the scrollbar growing so quickly.

src/routes/_components/virtualList/VirtualListLazyItem.html

@@ -12,6 +12,7 @@
   import { scheduleIdleTask } from '../../_utils/scheduleIdleTask'
   import { createPriorityQueue } from '../../_utils/createPriorityQueue'
   import { isMobile } from '../../_utils/userAgent/isMobile'
+  import { store } from '../../_store/store'
 
   // In Svelte's implementation of lists, these VirtualListLazyItems can be
   // created in any order. By default in fact it seems to do it in reverse
@@ -25,6 +26,7 @@
   export default {
     async oncreate () {
       const { makeProps, key, index } = this.get()
+      const { reduceMotion } = this.store.get()
       if (makeProps) {
         await priorityQueue(index)
         const props = await makeProps(key)
@@ -33,23 +35,22 @@
           this.set({ props: props })
           stop('VirtualListLazyItem set props')
         }
-        // On mobile, render in rIC for maximum input responsiveness. The reason we do
+        // On desktop, if prefers-reduced-motion is enabled, avoid using scheduleIdleTask
-        // different behavior for desktop versus mobile is:
+        // here because it causes the scrollbar to grow in a way that may sicken
-        // 1. On desktop, the scrollbar is really distracting as it changes size. It may
+        // people with vestibular disorders.
-        //    even cause issues for people with vestibular disorders (see also prefers-reduced-motion).
-        // 2. On mobile, the CPU is generally slower, so we want better input responsiveness.
         // TODO: someday we can use isInputPending as a better way to break up work
         // https://www.chromestatus.com/feature/5719830432841728
-        if (isMobile()) {
+        if (!isMobile() && reduceMotion) {
-          scheduleIdleTask(setProps)
-        } else {
           setProps()
+        } else {
+          scheduleIdleTask(setProps)
         }
       }
     },
     data: () => ({
       props: undefined
     }),
+    store: () => store,
     components: {
       VirtualListItem
     }