OM @TAKUFUKUSHIMA

OM ADDS MORE VALUES TO REACT.JS

OM SWEET OM: (HIGH-)FUNCTIONAL FRONTEND ENGINEERING WITH CLOJURESCRIPT AND REACT

CONCLUSION: SIMPLICITY WINS

PERFORMANCE

UNDO THE BIGGEST DIFFERENTIATOR OF OM

WHO DOES NEED UNDO ON THE CLIENT-SIDE?

SHIFT TO THE WEB TECHNOLOGIES

UNDO MADE EASY

ClojureScript was a big enabler. David Nolen, Creator of Om

TIME TRAVEL ;; Initial state. (def app-history (atom [@app-state])) ;; When the state is changed, it's added to the history. (add-watch app-state :history (fn [_ _ _ n] (when-not (= (last @app-history) n) (swap! app-history conj n)) (set! (.-innerHTML (.getElementById js/document "message")) (let [c (count @app-history)] (str c " Saved " (pluralize c "State")))))) ;; If the undo button is pressed, pop the state. (aset js/window "undo" (fn [e] (when (> (count @app-history) 1) (swap! app-history pop) (reset! app-state (last @app-history)))))

CLOJURESCRIPT ROCKS 1. ClojureScript ecosystem 2. Macros 3. Persistent data structures

1. CLOJURESCRIPT ECOSYSTEM

GOOD PARTS OF CLOJURESCRIPT Clojure 3rd party libraries Source Map Interop with JavaScript

2. MACROS

MACRO SAVES YOUR TIME COMPILATION TIME META PROGRAMMING, WHICH IS HARD IN JAVASCRIPT. prismatic/om-tools

3. PERSISTENT DATA STRUCTURES

PERSISTENT DATA STRURCTURES ARE MEMORY EFFICIENT

GET UNDO NOW

WRAP-UP SIMPLICITY AND UNDO

THE END OF SLIDES; ANY QUESTION?

REFERENCES Om sweet Om: (high-)functional frontend engineering with ClojureScript and React - http:// blog.getprismatic.com/om-sweet-om-high-functional- frontend-engineering-with-clojurescript-and-react/ PrismaticEngineering Tweet - https://twitter.com/ PrismaticEng/status/478988034407276546 Vue.js Performance Comparisons - http://vuejs.org/ perf/

REFERENCES IMMUTABILITY, INTERACTIVITY & JAVASCRIPT, Balcerona Future JS: http://futurejs.org/agenda/ immutability-interactivity-javascript GoyaPixel - http://jackschaedler.github.io/goya/ Time Travel, dosync - http://swannodette.github.io/ 2013/12/31/time-travel/ Adobe Photoshop.com - http://www.photoshop.com/

REFERENCES Google Docs - https://docs.google.com/ Atom - https://atom.io/ Git - http://git-scm.com/ Other pictures are distributed under Taku Fukushima