clojurescript

Pros of shadow-cljs

• Faster Compilation: shadow-cljs is known for its fast compilation times, which can be a significant advantage for larger projects.
• Comprehensive Tooling: shadow-cljs provides a rich set of tools and features, including a development server, hot reloading, and advanced build configurations.
• Seamless Node.js Integration: shadow-cljs makes it easy to integrate ClojureScript with Node.js, allowing for server-side rendering and other server-side use cases.

Cons of shadow-cljs

• Steeper Learning Curve: shadow-cljs has a more complex configuration compared to the standard ClojureScript setup, which may be a barrier for some users.
• Limited Community Support: While shadow-cljs has a dedicated following, the ClojureScript community is generally more focused on the official ClojureScript compiler.
• Potential Vendor Lock-in: By using shadow-cljs, you may become more dependent on the tool and its ecosystem, which could make it harder to switch to other ClojureScript tooling in the future.

Code Comparison

Here's a brief comparison of the configuration for a simple ClojureScript project using clojure/clojurescript and thheller/shadow-cljs:

clojure/clojurescript

(defproject my-project "0.1.0-SNAPSHOT"
  :dependencies [[org.clojure/clojure "1.10.1"]
                 [org.clojure/clojurescript "1.10.773"]]
  :plugins [[lein-cljsbuild "1.1.8"]]
  :cljsbuild {:builds [{:id "dev"
                       :source-paths ["src"]
                       :compiler {:main my-project.core
                                  :output-to "resources/public/js/main.js"
                                  :output-dir "resources/public/js"
                                  :asset-path "/js"
                                  :optimizations :none
                                  :source-map true}}]})

shadow-cljs

{:source-paths ["src"]
 :dependencies [[org.clojure/clojure "1.10.1"]
                [org.clojure/clojurescript "1.10.773"]]
 :builds {:app {:target :browser
                :output-dir "resources/public/js"
                :asset-path "/js"
                :modules {:main {:entries [my-project.core]}}
                :devtools {:http-root "resources/public"
                           :http-port 3000}}}}

Pros of Reagent

• Reagent provides a simple and lightweight wrapper around React, making it easier to use React in a Clojure(Script) context.
• Reagent's component-based approach aligns well with the functional programming principles of Clojure(Script), promoting modular and reusable UI components.
• Reagent's integration with Clojure(Script)'s data structures and immutable state management makes it a natural choice for building reactive and efficient user interfaces.

Cons of Reagent

• Reagent has a smaller community and ecosystem compared to ClojureScript, which may limit the availability of third-party libraries and resources.
• Reagent's simplicity and minimalism can be a double-edged sword, as it may require more boilerplate code or custom implementation for certain advanced features.
• Debugging and troubleshooting Reagent-based applications may be more challenging, as the integration with React can add an additional layer of complexity.

Code Comparison

ClojureScript (from clojure/clojurescript):

(defn hello-world []
  [:div
   [:h1 "Hello, World!"]
   [:p "This is a ClojureScript example."]])

(defn ^:export main []
  (js/ReactDOM.render
   (hello-world)
   (js/document.getElementById "app")))

Reagent (from reagent-project/reagent):

(defn hello-world []
  [:div
   [:h1 "Hello, World!"]
   [:p "This is a Reagent example."]])

(defn ^:export main []
  (reagent.dom/render
   [hello-world]
   (js/document.getElementById "app")))

Pros of re-frame

• re-frame is a well-established and widely-used framework for building complex web applications with ClojureScript, providing a clear and opinionated structure for managing application state and UI.
• re-frame comes with a rich ecosystem of libraries and tooling, making it easier to build and maintain large-scale ClojureScript applications.
• re-frame's focus on functional programming and reactive programming principles can lead to more maintainable and testable code.

Cons of re-frame

• re-frame has a steeper learning curve compared to ClojureScript alone, as it introduces its own set of concepts and patterns that developers need to understand.
• re-frame's opinionated nature may not align with the preferences of all developers, and it may be more difficult to deviate from the recommended practices.
• The re-frame ecosystem is smaller compared to the broader ClojureScript ecosystem, which may limit the availability of third-party libraries and tools.

Code Comparison

ClojureScript (from clojure/clojurescript):

(defn hello-world []
  [:div "Hello, World!"])

(defn ^:export main []
  (js/ReactDOM.render (hello-world) (js/document.getElementById "app")))

re-frame (from day8/re-frame):

(ns my-app.core
  (:require [re-frame.core :as re-frame]))

(re-frame/reg-event-db
 ::initialize-db
 (fn [_ _]
   {:message "Hello, World!"}))

(re-frame/reg-sub
 ::message
 (fn [db _]
   (:message db)))

(defn hello-world []
  [:div @(re-frame/subscribe [::message])])

(defn ^:export main []
  (re-frame/dispatch [::initialize-db])
  (js/ReactDOM.render [hello-world] (js/document.getElementById "app")))