Fork me on GitHub
#hyperfiddle
<
2022-11-28
>
denik21:11:10

seamless & fast infinite scroll over a server-side datalog db query w/ #photon

🔥 11
👏 3
Dustin Getz21:11:42

How long did it take you and how many LOC

denik21:11:14

once I understood how to control the lifecycle of js object instances with missionary, 30 mins to impl demo, 3 mins to add to prod code

denik21:11:18

here’s the demo

(p/defn IntersectionObserverDemo []
  (let [data          (range)
        !render-count (atom 50)
        render-count  (p/watch !render-count)]
    (dom/div {:style {:height :200px :overflow :scroll}}
      (let [obs (make-observer dom/node
                               (fn [t]
                                 (swap! !render-count + 20)))]
        (new (m/observe (fn [!]
                          (! nil)
                          #(j/call obs :disconnect))))
        (p/for [c (take render-count (drop render-count data))]
          (dom/div c))
        (dom/div
          (new (m/observe
                 (fn [!]
                   (! nil)
                   (j/call obs :observe dom/node)
                   #(j/call obs :unobserve dom/node))))
          "Loading...")))))

denik15:11:39

it’s so fast that I’m going to remove the “loading…” copy

😁 2