throttle.cljs

(ns async-test.throttle.core
   (:require [cljs.core.async :refer [chan close!o sliding-buffer]]
            [clojure.string :as string])
  (:require-macros
    [cljs.core.async.macros :as m :refer [go alts!]]))

(def c (chan (sliding-buffer 1)))
(def loc-div (.getElementById js/document "location"))

(.addEventListener js/window "mousemove"
  (fn [e]
    (go
      (>! c [(.-x e) (.-y e)]))))

(defn timeout [ms]
  (let [c (chan)]
    (js/setTimeout (fn [] (close! c)) ms)
    c))

(defn throttle [c ms]
  (let [c' (chan)]
    (go
      (while true
        (>! c' (<! c))
        (<! (timeout ms))))
    c'))

(def throttled (throttle c 500))
 
(go
  (while true
    (let [loc (<! throttled)]
      (aset loc-div "innerHTML" (string/join ", " loc)))))

If I understand correctly, c is an unbuffered channel and each fire of the mousemove event handler creates a new IOC thread (goroutine?) that blocks until it can put a value onto the channel---which they can only do once every 500 ms when the consuming IOC thread's loop iterates.

As far as I know, there is no guarantee about execution order of the IOC threads, so in this example there's no reason to expect that the rendered mouse coordinates are the most recent coordinates from the past 500 ms.
Is that correct?

This code produces javascript errors when I move the mouse (Chrome).

It works when switching c to (def c (chan (async/sliding-buffer 1))) . I guess "pausing" doesn't quite work yet (in the CLJS implementation) otherwise (>! c [x y]) would "pause" until the event is consumed, which only happens every 500ms.

@lynaghk @thheller I made an error, I should have created a chan with a sliding-buffer, updated.