404

useEffectEventがStale Closureを解決する原理をReactの内部実装とともに分析し、React Compilerのfire()がこれをどう自動化するのかを探る。

リメンバーでの4年半を振り返りながら、テックリードの経験と成長についての悩み、そして転職、FEConfでの発表やフィルム制作など今年の記憶を整理してみる。

CSSに新しく追加されたif()関数を使って条件付きスタイリングを実装し、CSSで論理ゲートを構築する方法を紹介する。

最近、判断を迫られる場面が増えた。頭の中であれこれ考え込んでしまい、判断が遅いタイプだ。瞬間的な判断に弱いので、判断のプロセスを整理して鍛えようとしている。

Promise.tryの起源と提案過程、そして実装について一緒に見ていこう。Promise.tryが標準に組み込まれたと聞いたとき、調べてはみたものの、何のためのものなのかすぐには理解できなかった。何かしらの目的を持って生まれたはずなのに…むしろ画期的な機能ならともかく、こうした小さな追加にはきっと物語があるはずだと感じた。たとえ大した話ではなくとも。今日は考古学者となって、その起源と提案過程、そして実装について一緒に見ていこう。

オスロでの初日

楕円の数学的な美しさと、ダンドラン球を通じた円柱断面の幾何学的性質を探る記事である。高校時代の好奇心から始まった楕円の周長計算への旅と、3D可視化による直感的な理解の過程を綴った。

TopLayer（dialog、popover API）を使用する際にReact DevToolsのハイライトやインスペクタが正しく表示されない問題と、それを解決するためにReactオープンソースに直接コントリビュートした経験を共有する。

スヴァールバル旅行の準備をしながら...

Norsk er et veldig vanskelig språk.

2024年の最終日

ある暑い日、図形の国の開発者「三角（セモ）」は4歳の時に「パパ ママ」より先に「hello world」と叫んだ天才開発者である。三角は成長して図形の国の中核開発者となり、一気呵成にコードを暗算のように書き上げる開発者として名を馳せた。

ProxyとReflectはES6で追加された機能である。Proxyはオブジェクトの基本動作をインターセプトする機能を提供し、Reflectはオブジェクトの基本動作を代行するメソッドを提供する。実例を通して見ていこう。

React CompilerのSSA変換について見ていきましょう。SSAはStatic Single Assignment（静的単一代入）の略で、最適化のために使用される中間表現の一つです。SSAは変数が一度だけ代入されるように制限する特徴を持っています。SSA変換アルゴリズムの核心はphi関数をどこに配置するかを決めることです。React Compilerではどのようなアルゴリズムを使用しているのでしょうか？

React CompilerのLoweringプロセスを見てみよう。ASTをHIRに変換する過程である。

React Compilerの主要な構成要素の一つであるuseMemoCache について深く掘り下げよう。useMemoCache の動作原理と実装を見ていき、実験的機能であるenableNoCloningMemoCacheについても解説する。

React Compilerについて深く掘り下げてみたい。まずはBabelプラグインを通じてコンパイラのエントリーポイントを見ていこう。

サンフランシスコとサンノゼでの日常をまず書こうとしていたら、いつの間にかベガスまで来てしまった。本来の目的地だったラスベガス、React Conf 2024が開催される場所だ。3年ぶりの開催ということもあり、参加者がとても多い。空港からリゾートまではかなり距離があったので、カンファレンスのDiscordで相乗りする人を探すことにした。

もう3日目になる。韓国では日曜日が終わったが、こちらはまだ日曜日が始まったばかりの午前10時頃だ。毎晩寝る前に記録を残そうと思っていたが、時差ボケに悩まされながら撮影したものを整理し、緊張が解けてシャワーを浴びたら眠ってしまった。

高度33,000フィート、太平洋上空のどこかでWi-Fiが使えるとは思わなかった。せっかくオフライン保存してきたYouTube動画たちが台無しになった。フライト中にコミットを一行残そうと、こうして文章を書いている。

今日は出国の日だ。React Confを見にアメリカへ向かう。昨日無事にPRをマージしてデプロイも完了したので、頭は軽いのだが、何か問題があるんじゃないかと心は重い。大きな予定がない限り有休をあまり使わないタイプだったので今年初めての有休でもあるし、もともとFOMOが激しい方なので、何か見逃していることがないか心配だ。仕事からうまく離れてリフレッシュして戻ってくるのも、効率的な開発者ということだろう...

Reactにもform actionやuseFormState、useFormStatusといったフォームに関連するフックがある。 これらのフックがどのように動作するのかを見ていきたい。useActionStateは非同期アクションを処理するためのフックである。useFormStateについて調べていたところ、useActionStateという名前に変更されていた。

まず、formとは何だろうか？誰かにこの質問を投げかけられたら、どう答えるだろうか？Hypertext Markup Language - 2.0 によると、formは次のように定義されている。A form is a template for a form data set and an associated method and action URI.

冒頭に載せた動画は、イーロン・マスクがスターシップに関する計画を語っているものだ。今年中に6基のブースターとスターシップを建造し、来年までに空中で機体をキャッチする「メカジラ」発射台も4基建設する計画だという。

本当にあっという間に第1四半期が過ぎ去った。#運動 昨年1月から始めたF45に1年近く通ってから少し休んでいた。もともと運動を好むタイプではなかったので、いつも強制力の伴う運動をしていたが、ちょうど有酸素と筋トレが適度にミックスされたF45が自分に合っていた。

問題に直面し、それらを解決する仕事をしている。『問題』と向き合い続けると、否定的なエネルギーに包まれてしまうものだ。ネガティブな感情は周囲をあまりにも簡単に汚染させる。ポジティブなエネルギーを与える人になろう。

`text-wrap: balance` まだ聞いたことがない人もいるかもしれませんが、 上記のGoogle文書で確認できるように、Chrome 114から対応された[CSS Text Level4](https://www.w3.org/TR/css-text-4/#text-wrap)に属するCSSプロパティです。

この発表の内容の一部を補足して整理してみた。React.HTMLAttributes<HTMLButtonElement>、React.HTMLProps<HTMLButtonElement>、JSX.IntrinsicElements['button']、React.ButtonHTMLAttributes<HTMLButtonElement>

きっかけは正規表現への素朴な疑問だった。何気なく使っていた正規表現とは一体何なのか？なぜ様々なプログラミング言語で共通して使われているのか？そんな疑問を抱いた。

Midjourneyのランディングページがとても気に入って、どんなライブラリを使っているのか調べていたら、クローニングした動画を見つけた。その方の作業を見ると、コード量はそれほど多くなかったので、自分でもクローニングしてみた。トランスフォームのロジックだけ少し分離して、パイプライン形式で入れられるようにした。作った後、Lit Elementでうまくラップした。

旧正月に実家に立ち寄った際、高校2年生の頃に買っていた本を見つけた。原題は『How to Solve It』、邦訳では『いかにして問題をとくか』として知られるこの本は、数学的思考法について書かれたものだ。おそらく当時、Calculusのバイオリンの教科書を買うために教友社のホームページを訪れた際に見つけたのだと思う。

cancelTokenがリクエストのconfigに渡される際、どのようにsubscribeされるかを確認した。今回はCancelTokenの実装とともに、どのように直接的にキャンセルされるのかを見ていこう。まずCancelTokenの実装体を見てみよう。

Axiosリクエストをキャンセルしてみよう。axiosでリクエストを送る際にcancelTokenを渡すとキャンセルできる。cancelTokenを渡すとどこに流れていくのだろうか？

明日（土曜日）は夜通しのサービスメンテナンスがある予定で、会社で夜明けを過ごさないといけない。リズムを合わせるために寝るか寝ないか迷っている。でも寝ないとね。そうしないと明日仕事ができないから。ブログを作った理由は、勉強したことを載せるためでもあるけど、

家の近くにマムズタッチが一軒あって、いつだったかどこかでマムズタッチの「メコム・キムトクマン」がとても美味しいという話を聞いた。どんな味なんだろう？チリソースが入っているのか？それともただ辛い味なのか？通勤のたびにその前を通るたび、今日こそ食べてみようと思いながら、毎回見逃してしまっていた。

タイトルはこうなっているが、実は本物のstyled-componentsを使う話ではない。dream-css-toolという試みをしている方を見つけた。styledのような書き方でサーバーコンポーネントでも動作するようにする取り組みだ。まずは使い方から見てみよう。

家の前にたい焼きの屋台があって、一匹1,000ウォンだ。一昨日作ったコンポーネントを整理してみよう。最初はYouTubeの埋め込みのために適当にラップして使うLitコンポーネントを作っていた。YouTubeリンクを受け取るsrcとキャプションを受け取るcaption、この2つのプロパティを受け取る。

遥か彼方、ノルウェーと北極点の間にスヴァールバル諸島という場所がある。いつかそこに行こうと心に決めて暮らしている。雪の積もった日々がとても好きだ。白いキャンバスのような感じもあるし、遠くから眺めると清らかに見えるのがいい。膝まで雪が積もって歩くのが大変な日々を想像することがあるが、まだそんな日は訪れていない。そんな場所に行けていないからだろう。

[Astro 4.0](https://astro.build/blog/astro-4/)がリリースされたという知らせを聞いた。ブログもアップデートするついでに色々と更新した。アイランドアーキテクチャ…その他…などなど…Astroが持つ利点については深く把握して選んだわけではなかった。

今年の上半期、そして下半期の半分を埋め尽くしたマイブリッジ。マイブリッジは日本で運営しているリメンバーの日本版である名刺管理サービスだ。リメンバーで2年目に入るタイミング、そして2023年の始まりとともに新事業Crewという新しい組織が立ち上がり、6月初旬を目標に、従来日本で無料運営していたマイブリッジの有料化作業が始まった。

すべてのエレメントの上にレンダリングされるエレメント。対応エレメント：`<dialog>`、popover属性 `<div popover=auto>`。これらのエレメントをアニメーション可能にすることが目標