masa_iwasakiのブックマーク - はてなブックマーク

最近のフロントエンドフレームワークに対する認識とお気持ちの整理 - console.lealog();
久しぶりに、いわゆるポエムを。新規・運用ヘルプを問わず、受託や副業でよくフロントエンドをやってるWeb屋の見解、そして手札のお悩み。この先、また技術選定する際なんかにも参考になるかと思ったので。 React 「いまフロントエンドやるなら最初に覚えるべき！」は、もう過去の話かなーと個人的には思ってる。 Reactは`UI = fn(state)`なのが良い！とか言われるけど、あなたが必要としてるのは`UI = Component(props)`かもよって。一昔前までは、たしかにあらゆる面で頭一つ抜けてる印象はあったけど、今はそうでもないか、その差はだいぶ埋まってきてると思ってる。（もちろん先行者利益みたいなところで、エコシステムはまだまだ優位な差があるかもしれんけど、それもあまり実感できたことはないし、いまからはじめる人はそんなんで困らんやろうし）原初の時代からReactな案件をそれ
masa_iwasaki 2022/11/02
リンク
Solidの特徴と、その裏側 - console.lealog();
https://www.solidjs.com ずっと調べたいものリストにはあったやつで、Astro熱がちょっと収まったのでこのタイミング。めちゃめちゃ雑にまとめると、React + MobX feat. Svelteって感じのUIフレームワークです。（つまり好みは分かれるであろう） Solidとは基本はReactライクな書き味 JSXでコンポーネントを書く、Propsでデータを単方向に流すもちろん細かい挙動に差異はあるし、互換性はない `Suspense`とか`Portal`とか`ErrorBoundary`とかもある MobXライクなリアクティブの仕組みがビルトインされてる Propsが自動でProxyされてるイメージ依存配列なしに、状態を読み取ったコンポーネント・関数だけが更新できたりストア（ちょっと大きめの状態用）関連のコードもある Svelteと同様に、コンパイルして最
masa_iwasaki 2022/07/06
js

jsx
リンク
無音を鳴らして自動再生ポリシーをアンロックする - console.lealog();
Safariなどのブラウザには、音の自動再生に制限があって、ロード時にいきなり再生！というのがだいたいできない時代。（この制限にはいろいろ条件があるけども）そのため、「このサイトでは音が出ます」みたいなモーダルを出して、まずそれをクリックしてもらい、そのタイミングでこの制限を突破するために一手間かけるということが行われてきた。で、そのひと手間で盛大に音を鳴らすわけにはいかないので、無音を鳴らすという半ばハック的な方法があるのである。その無音の鳴らし方を毎回思い出すのが大変なので、いい加減メモっておく。 HTMLAudio const $audio = new Audio(); $audio.src = "/sound-of-silence.mp3"; $audio.play(); ここでアンロックした`audio`要素を使い続けることが重要で、Reactとかでイミュータブルにやるとな
masa_iwasaki 2022/05/27
web
リンク
なんでもSPAにするんじゃねぇ！という主張のその先 - console.lealog();
Your shopping website is not an SPA. I repeat: your shopping website is not an SPA. Stop trying to sculpt David with a JS chainsaw and get yourself an HTML/CSS chisel.— Alex Russell (@slightlylate) 2021年8月10日この主張、界隈（少なくとも自分の観測範囲）では割とよく見かけるし、なんか定期的に話題になるトピックなのかなーと。まあ持論としてもコレには概ね同意しており、会社のスタンスとも相まって、常日頃からぼんやり考えてたりすることでもある。で、そんな折にこのツイートを発見して、さらにそれに言及してる人々を見て、ふと自分でも現状を整理しておきたいなーという気持ちになったので筆を執った次第。
masa_iwasaki 2021/08/12
js
リンク
1