12/25

今日は実践デー的な感じで、ブログの直しとかwp-headlessのサイト使ってみたりとかしようかな。
Today feels like a hands-on day, so I think I'll work on fixing my blog and try out the wp-headless site.

デザイン

ptって1.33pxなんだって。
Webは12~16pt だと 16~21pxくらい

昨日雑誌を立ち読みし漁って、本文も基本的にはゴシック体が多かったかな、
しっかりと読ませるような、文字が多いところは明朝体になっていて印象が違っていた、落ち着いた雰囲気は明朝体なのかなと思った。
クモンの「大人の語彙力」はやわらかい形のゴシック体で、楽しい感じなのかなと思った。

パフォーマンス

WebWorkers

JSはUIスレッド上で行われる。
WebWorkersを利用することで、別のスレッドでJSコードを実行できる。

const worker = new Worker('./worker.js')でオブジェクトを生成し、worker.postMessage()でやり取りする。

Comlinkというライブラリがあり、使われているようだ。

Next.jsではClient Component限定。

理論上CPUのコアの数だけマルチスレッドで処理を行えるらしい。コア数はconsole.log(navigator.hardwareConcurrency);で調べられる。

WebWorkersを通じてやり取りするデータは通常コピーされた値。オーバーヘッドが生じる。避けるためにTransferableを活用する。

WebAssembly

パフォーマンスを向上させるために下位レベルの言語を用いて計算を高速化する。
RUST, C, C++ のいずれかを使うが、glslに似たC言語を扱えるかもしれない。

ハイレベルのため割愛。

wp-headless

shadcn/ui デフォルトできれいに

proseを使用。
darkモード対応のためdark:prose-invertを使用。
proseを適用捺せたくないものにはnot-prose。
子要素に追加させたいものにはprose-li:borderみたいな。

<article className="prose dark:prose-invert dark:prose-pre:border">
 <hgroup className="not-prose">
　　<h1 className="text-5xl font-bold">{title}</h1>
　</hgroup>
</article>

shadcn/ui ダークモード

デフォルトでは親に.darkを入れるとダークモードになるようになっている。
システムに依存させるにはnpm install next-themes

その他

• pagenationはpage=1&per_page=2とかで
• wordpressのrestapiのサイトかなりわかりにくい
• Image fill=trueだとsizesが必要
• searchはしっかり日本語はencodeURIComponent
• めっちゃ簡単にフォームを作成できるサイト
  googleform or tallyform

感想

いままで自分が洗顔だと思っていた炭のやつは、クレンジングだということに初めて気づいた。
つまり１年近く洗顔してなかったということか...

今日はあんまりやろうと決めたことをできなかった。
うーん。

Today I didn't manage to do much what I'd decided to do in the morning. Hmm...