소설 연재 플랫폼 개발 일지 005

November 1, 2022

다시 shadow-grove로 #

레퍼런스가 없어서 힘들었었는데 다시 해보니 뭔가 알 것 같다. shadow-cljs를 개발한 thheller가 만들고 있는 cljs 프레임워크인데 하나 하나 설명을 읽어가면서 개척해나가는 재미가 나름 있다. 당연하게 여겼던 hot-reload도 여기서는 직접 구현해야 했다. 다행히 thheller 이 분이 Hot Reload in ClojureScript 라는 아티클을 남겨두셔서 조금 이해할 수 있었다. 나중에 꼭 번역을 해둬야겠다.

Css 관련 배운 것 #

css는 가능한 static하게 서빙하는 게 좋다고 한다. 동적으로 런타임에 css를 빌드하게 되면 그만큼 사용자에게 그 비용을 전가하게 된다.

Jvm memory 사용량 #

원래 css로 tailwind를 써보다가 빌드 훅을 잘못 짰는지 빌드 할 때마다 jvm 메모리 사용량이 40% 까지 올라가곤 했는데 다음 옵션을 shadow-cljs.edn에 명기함으로써 램을 최대 1G 까지만 사용하라고 정해줄 수 있었다.

 :jvm-opts
 ["-Xmx1G"]

shadow-grove에는 shadow-css #

tailwind를 따로 의존성에 추가하지 않아도 된다. tailwind config 파일을 따로 관리하지 않아도 되어서 너무 좋다. 메모리 제한을 둬서 그런지 몰라도 css 빌드 훅도 안정적이고 훨씬 빠르게 적용된다.

아래는 shadow-css 리포지터리의 css dev-build 를 참고하여 작성해본 빌드 훅이다. 현재는 cljs를 js로 빌드할 때마다 전체 css 파일을 다시 쓰고 있는데 더 나은 방법은 없을까…

(ns app.css
  (:require
   [clojure.java.io :as io]
   [shadow.css.build :as cb]))

(defonce css-ref (atom nil))

(defn generate-css []
  (reset! css-ref
          (-> (cb/start)
              (cb/index-path (io/file "src" "main") {})))

  ;; 변경된 pulp.app 네임스페이스의 코드를 읽어 pulp.css 파일로 빌드하여 public/css/ 디렉터리에 쓴다.
  ;; wildcard인 별표로 pulp.app를 다 보고 있지만 css 생성만 담당하는 파일을 만들어 해당 파일이 변경될 때만
  ;; css를 생성하도록 로직을 변경해봐야겠다.
  (let [result
        (-> @css-ref
            (cb/generate '{:pulp {:include [pulp.app*]}})
            (cb/write-outputs-to (io/file "public" "css")))]

    (prn "css generated")
    (doseq [mod (:outputs result)
            {:keys [warning-type] :as warning} (:warnings mod)]
      (prn [:CSS (name warning-type) (dissoc warning :warning-type)]))
    (println)))

(defn gen
  {:shadow.build/stage :flush}
  [build-state]
  (prn "generating css...")
  (generate-css)
  build-state)

작성자는 fs-watcher를 추가하여 빌드 훅이 아니라 repl을 통해 따로 프로세스를 띄워두는 것 같은데 나는 아무리 해도 어떻게 하는건지 모르겠어서 그냥 빌드 훅으로 적용했다.

해결 못한 문제 #

clojure-lsp classpath를 못 읽는건지 자꾸 잘 작동하는 코드에 에러 메시지를 띄운다. shadow-cljs classpath 하면 shadow-grove가 있는 것이 확인되는데 관련 코드를 인식 못한다. unresolved symbol 어떻게 해결해야 할지 모르겠다. 그냥 lsp 끄고 써야하나.

Links to this note

clj-kondo