O Último Transpiler Que Você Irá Precisar

O Último Transpiler Que Você Irá Precisar

A era dos transpilers renovou toda a comunidade JavaScript. A modernização da linguagem instigou a criação de ferramentas de desenvolvimento. Floresceu novas abstrações para assíncrona e imutabilidade. Mas infelizmente também criou uma bagunça. E se pudéssemos unir tudo isso numa linguagem expressiva aliada ao Estado da Arte de minificadores e otimizadores de JavaScript? Apresento-lhes ClojureScript.

83aaddfb8a64b3fcdda06d8562013b7c?s=128

Andrew Rosa

June 18, 2016
Tweet

Transcript

  1. O Último Transpiler Que Você Irá Precisar

  2. Conhecendo ClojureScript

  3. CoffeeScript

  4. CoffeeScript → ✨ → JavaScript

  5. https://en.wiktionary.org/wiki/transcompiler trans- + compiler ! A translating compiler that takes

    the source code of a programming language as its input and outputs the source code into another programming language.
  6. JavaScript é… peculiar

  7. Plataforma poderosa

  8. Browser

  9. Servidor

  10. Dispositivos Móveis

  11. Desktop

  12. Internet of Things

  13. Serverless

  14. Muitas Armadilhas

  15. https://goblinrefuge.com/mediagoblin/u/mindaslab/m/javascript-the-bad-parts/

  16. Evolução Instável

  17. Regida por um Comitê

  18. Diferentes Implementações

  19. JavaScript → ✨ → JavaScript

  20. arrow functions, string interpolation, destructuring assignments, modules, classes, generators, etc…

  21. TypeScript, Elm…

  22. ClojureScript

  23. –Rich Hickey "Why are we doing this? Because Clojure rocks,

    and JavaScript reaches"
  24. Clojure é um LISP

  25. "Hello World"

  26. {:name "Andrew Rosa" :events [{:name "RuPy Campinas" :year 2016 :tags

    #{:ruby, :python, :js} :location "FEEC - Unicamp"}]}
  27. {:name "Andrew Rosa" :events [{:name "RuPy Campinas" :year 2016 :tags

    #{:ruby, :python, :js} :location "FEEC - Unicamp"}]}
  28. {:name "Andrew Rosa" :events [{:name "RuPy Campinas" :year 2016 :tags

    #{:ruby, :python, :js} :location "FEEC - Unicamp"}]}
  29. {:name "Andrew Rosa" :events [{:name "RuPy Campinas" :year 2016 :tags

    #{:ruby, :python, :js} :location "FEEC - Unicamp"}]}
  30. {:name "Andrew Rosa" :events [{:name "RuPy Campinas" :year 2016 :tags

    #{:ruby, :python, :js} :location "FEEC - Unicamp"}]}
  31. {:name "Andrew Rosa" :events [{:name "RuPy Campinas" :year 2016 :tags

    #{:ruby, :python, :js} :location "FEEC - Unicamp"}]}
  32. {:name "Andrew Rosa" :events [{:name "RuPy Campinas" :year 2016 :tags

    #{:ruby, :python, :js} :location "FEEC - Unicamp"}]}
  33. {:name "Andrew Rosa" :events [{:name "RuPy Campinas" :year 2016 :tags

    #{:ruby, :python, :js} :location "FEEC - Unicamp"}]}
  34. (+ 1 2)

  35. (+ 1 2)

  36. (+ 1 2)

  37. (defn greet "Returns a friendly greeting." [name] (str "Hello, "

    name))
  38. (defn greet "Returns a friendly greeting." [name] (str "Hello, "

    name))
  39. (defn greet "Returns a friendly greeting." [name] (str "Hello, "

    name))
  40. (defn greet "Returns a friendly greeting." [name] (str "Hello, "

    name))
  41. (defn greet "Returns a friendly greeting." [name] (str "Hello, "

    name))
  42. (defn greet "Returns a friendly greeting." [name] (str "Hello, "

    name))
  43. (defn greet "Returns a friendly greeting." [name] (str "Hello, "

    name))
  44. (defn greet "Returns a friendly greeting." [name] (str "Hello, "

    name))
  45. (defn greet "Returns a friendly greeting." [name] (str "Hello, "

    name))
  46. (defn greet "Returns a friendly greeting." [name] (str "Hello, "

    name))
  47. Macros

  48. • Retornar todos resultados de um termo de busca •

    Acumular resultados de páginas, imagens e vídeos • Buscar em múltiplos servidores, retornar resultado do mais rápido • Manter um timeout de toda operação, protegendo de servidores lentos
  49. c := make(chan Result) go func() { c <- First(query,

    Web1, Web2) } () go func() { c <- First(query, Image1, Image2) } () go func() { c <- First(query, Video1, Video2) } () timeout := time.After(80 * time.Millisecond) for i := 0; i < 3; i++ { select { case result := <-c: results = append(results, result) case <-timeout: fmt.Println("timed out") return } } return
  50. (defn google [query] (let [c (chan) t (timeout 80)] (go

    (>! c (<! (fastest query web1 web2)))) (go (>! c (<! (fastest query image1 image2)))) (go (>! c (<! (fastest query video1 video2)))) (go (loop [i 0 ret []] (if (= i 3) ret (recur (inc i) (conj ret (alt! [c t] ([v] v))))))))) ! (let [el (by-id "ex4-out") c (listen (by-id "search") :click)] (go (while true (<! c) (set-html! el (pr-str (<! (google "clojure")))))))
  51. Sem Callbacks :)

  52. Extensibilidade!

  53. Paradigma Funcional

  54. Favorece Imutabilidade

  55. Estruturas Persistentes

  56. ! (let [v [1, 2]] (println v) (println (conj v

    3)) (println v)) ! ;; => [1, 2] ;; => [1, 2, 3] ;; => [1, 2]
  57. ! (let [v [1, 2]] (println v) (println (conj v

    3)) (println v)) ! ;; => [1, 2] ;; => [1, 2, 3] ;; => [1, 2]
  58. ! (let [v [1, 2]] (println v) (println (conj v

    3)) (println v)) ! ;; => [1, 2] ;; => [1, 2, 3] ;; => [1, 2]
  59. ! (let [v [1, 2]] (println v) (println (conj v

    3)) (println v)) ! ;; => [1, 2] ;; => [1, 2, 3] ;; => [1, 2]
  60. ! (let [v [1, 2]] (println v) (println (conj v

    3)) (println v)) ! ;; => [1, 2] ;; => [1, 2, 3] ;; => [1, 2]
  61. V 1 2

  62. V 1 2 3 V'

  63. React & Immutable.js

  64. Store View Action Renderiza Modifica Dispara

  65. Linguagem Simbiótica

  66. (.length "Hello, World!")

  67. (.length "Hello, World!")

  68. (.length "Hello, World!")

  69. (js/alert "Hello, World!")

  70. (js/alert "Hello, World!")

  71. (ns my.namespace) ! (defn ^:export hello [] (println "Hello, World!"))

  72. (ns my.namespace) ! (defn ^:export hello [] (println "Hello, World!"))

  73. (ns my.namespace) ! (defn ^:export hello [] (println "Hello, World!"))

  74. my.namespace.hello();

  75. Om, Reagent, Rum

  76. Google Closure

  77. Standard Library

  78. left-pad?

  79. goog.*

  80. GC Compiler

  81. Dead Code Elimination

  82. None
  83. None
  84. None
  85. Cross-Module Code Motion

  86. Public Admin

  87. Public Admin

  88. Public Admin

  89. shared.js public.js admin.js

  90. Ferramentas

  91. None
  92. Leiningen

  93. Figwheel

  94. Demo

  95. Aprender mais? • http://clojurescriptkoans.com • http://www.braveclojure.com • Clojure Brasil (Facebook)

    • clj-br (YouTube) • #clojure-brasil (Slack: http://clojurians.net)
  96. ?

  97. Obrigado! @andrewhr_