Skip to content

Instantly share code, notes, and snippets.

Avatar
🐶

Roman Liutikov roman01la

🐶
View GitHub Profile
@roman01la
roman01la / re-frame.clj
Last active Oct 21, 2020
Debugging re-frame subscriptions
View re-frame.clj
(ns utils.re-frame
(:require [cljs.compiler :as cljsc]))
(defn- anonymous-function-declaration? [form]
(and (list? form)
(= 'fn (first form))
(vector? (second form))))
(defn- query-id->js-fn-name [query-id]
(let [ns-part (when-let [ns-part (namespace query-id)]
@roman01la
roman01la / rum-0.12.0.md
Last active Jun 29, 2020
Rum 0.12.0 release notes
View rum-0.12.0.md

Rum 0.12.0 release notes

Happy to announce that Rum 0.12.0 has been released.

Sablono -> Daiquiri

A major change in this release is Daiquiri — reworked fork of Sablono. The reason we went with a fork is to own the compiler/interpreter. Daiquiri removes input field wrappers, this was causing weird bugs with jumping caret. Similarly to Sablono, Daiquiri makes use of ClojureScript's type inference to reduce number of generated interpret calls when compiling Hiccup. This applies to primitive types such as number, string, array and function, and also anything that is hinted as js/React.Element, Rum components include the type hint implicitly.

Removed rAF based scheduling mechanism

Sablono's input wrappers exist because some ClojureScript React wrappers have their own update scheduling mechanism built on top of js/requestAnimationFrame which doesn't play well with input fields. In this release we've removed Rum's scheduler, which allowed us to remove input wr

View is-cljs-value.js
function googIsObject(v) {
var type = typeof v;
return "object" == type && null != v || "function" == type;
}
function isPrototype(v) {
return v === v.constructor.prototype;
}
function isCLJSType(v) {
View github_icons.js
var icons = [
"<svg height=\"32\" class=\"octicon octicon-mark-github text-white\" viewBox=\"0 0 16 16\" version=\"1.1\" width=\"32\" aria-hidden=\"true\"><path fill-rule=\"evenodd\" d=\"M8 0C3.58 0 0 3.58 0 8c0 3.54 2.29 6.53 5.47 7.59.4.07.55-.17.55-.38 0-.19-.01-.82-.01-1.49-2.01.37-2.53-.49-2.69-.94-.09-.23-.48-.94-.82-1.13-.28-.15-.68-.52-.01-.53.63-.01 1.08.58 1.23.82.72 1.21 1.87.87 2.33.66.07-.52.28-.87.51-1.07-1.78-.2-3.64-.89-3.64-3.95 0-.87.31-1.59.82-2.15-.08-.2-.36-1.02.08-2.12 0 0 .67-.21 2.2.82.64-.18 1.32-.27 2-.27.68 0 1.36.09 2 .27 1.53-1.04 2.2-.82 2.2-.82.44 1.1.16 1.92.08 2.12.51.56.82 1.27.82 2.15 0 3.07-1.87 3.75-3.65 3.95.29.25.54.73.54 1.48 0 1.07-.01 1.93-.01 2.2 0 .21.15.46.55.38A8.013 8.013 0 0016 8c0-4.42-3.58-8-8-8z\"></path></svg>",
"<svg height=\"24\" class=\"octicon octicon-x text-gray\" viewBox=\"0 0 12 16\" version=\"1.1\" width=\"18\" aria-hidden=\"true\"><path fill-rule=\"evenodd\" d=\"M7.48 8l3.75 3.75-1.48 1.48L6 9.48l-3.75 3.75-1.48-1.48L4.52 8 .77 4.25l1.48-1.48L6
View core-test.cljs
(ns core-test
(:import [goog.net Jsonp]
[goog Uri]))
(def x "123")
(def y "456")
(def url
(str x y))
View user.cljc
(ns user
#?(:cljs (:require-macros [user])
:clj (:require [cljs.source-map :as sm]
[clojure.data.json :as json]
[clojure.java.io :as io]
[clojure.string :as str]
[cljs.env :as env])))
#?(:clj
(defn map-location [env form & {:keys [offset]}]
View rum-0.11.5.md

Rum 0.11.5 release notes

Happy to announce that Rum 0.11.5 has been released with quite a few bug fixes and new features.

React Hooks

For anyone excited about this, now you can use React Hooks in Rum. Hooks work only in function-based React components, but because Rum already generates those when using defc macro it was trivial to add support for them without breaking changes.

Hooks are compatible only with defc components and only without any mixins, except rum/static. This distinction exists because mixins are meant to be used in lifecycle methods of React's class-based components. You should be using either mixins or hooks in a single component, mixing those together would generate class-based components and hooks won't work.

Another important note is that Clojure's equality semantics does not apply to dependencies collection is Hooks, at least as of now. Instead React compares them by identity as usual in JavaScript. For Rum users this means that values in d

View a.md
mkdir hello-bundler
cd hello-bundler
echo '{:deps {org.clojure/clojurescript {:mvn/version "1.10.741"}}}' > deps.edn
@roman01la
roman01la / clojurescript-repl-workflow.md
Last active Jun 7, 2020
ClojureScript REPL Workflow
View clojurescript-repl-workflow.md

ClojureScript REPL Workflow

Short write up on using REPL when developing UIs in ClojureScript.

Hot-reload on save or Eval in REPL?

Everyone's standard approach to hot-reloading is to use a tool (Figwheel or shadow-cljs) that reloads changed namespaces automatically. This works really well: you change the code, the tool picks up changed files, compiles namespaces and dependants, notifies REPL client which then pulls in compiled changes, and re-runs a function that re-renders UI.

The other approach is to use ClojureScript's REPL directly and rely only on eval from the editor. This more or less matches Clojure style workflow. This approach might be useful when you don't want tools overhead or hot-reloading becomes slow for you or you just used to this style of interactions. Also changing code doesn't always mean that you want to reload all the changes. On the other hand it is very easy to change a couple of top-level forms and forget to eval one of them.

@roman01la
roman01la / index.md
Last active Jan 7, 2020
Abusing constants table in ClojureScript's compiler
View index.md

Abusing constants table in ClojureScript's compiler

In React wrapper library UIx that I'm working on there's defui macro that compiles Hiccup directly into React's VirtualDOM. Apart from doing that the macro also hooks into the compiler to hoist constant parts of VirtualDOM across components and namespaces, so that those parts will be essentially interned (cached).

Here's an example of two components defined in different namespaces where both of them share a part of the structure.

(ns foo.core
  (:require [uix.core.alpha :refer [defui]]))
You can’t perform that action at this time.