Closed22
Weekly - 2023
yoshi2023/04/21
React Email
- React, TypeScriptでHTMLメールを生成
- Button, Container, Textなどのコンポーネントを提供
- Gmail, Apple Mailなどの主要なメーラーをサポート
yoshi2023/04/28
How Are Function Components Different from Classes? (復習)
- Class ComponentとFunctional Componentでは、propsの挙動が異なる
-
this.propsなどのthisはミュータブルなため、コンポーネントが再レンダリングされると値が更新される(クロージャを使い、render関数内でthis.propsをCaptureする場合は例外) - 一方関数コンポーネントは、propsが引数として入ってくる時点でCaptureしている(クロージャによってpropsを閉じ込めている)
yoshi2023/05/05
yoshi2023/05/26
読みやすいコードの書き方 第 1 回 / Code readability: Session 1 (ver. 2, Ja)
- 「読みやすさ」は開発を継続しやすくするための手段
- 美しさ、単純なコード != 読みやすいではないため、多少冗長になっても理解しやすいコードを書く
ビギナー向け エッジランタイムのすすめ | エッジランタイムを意識した開発をはじめよう
- エッジランタイムとはCDNロケーションに配置されたコンピューティングリソースおよびその実行環境
- 以下の理由からエッジコンピューティングが流行っている
- Core Web Vitalsとの関連性
- エッジコンピューティングがJavaScript/V8 isolate環境下であれば、キャッシュハンドリングをJavaScript感覚で行える
- JS/TSで書けるためテスト環境(Jest/Vitest)が容易
- 具体的なユースケース
- キャッシュの柔軟なハンドリング
- ABテストのルーティング
- 3rd party scriptの実行
- 感想
- 3rd party scriptの実行をEdge上で行うのがブラウザ上でのWebパフォーマンスの観点から良さそう
- Core Web VitalsのFCPのスコア低下の原因となる可能性があるため、ブラウザ側では極力広告タグ系を実行せずにEdge上で実行するという手段はありだなと思った
- 3rd party scriptの実行をEdge上で行うのがブラウザ上でのWebパフォーマンスの観点から良さそう
Rauno's web interface guidelines
- VercelのデザイナーであるRauno Freiberg氏がWebインターフェイスのためのWebガイドラインをシェア
yoshi2023/06/01
一貫性のある自然さを生み出す、「Ameba」らしさを加速させるアニメーションシステム
- Animationの役割は以下の3つ
- 要素間や、ユーザーの入力とシステムの出力の関係をつなぎとめ、可視化する事
- ユーザーが特定のタスクに集中でき、惑わないように方向性を支持する事
- UIとのインタラクションにキャラクター(生命)を宿しユーザーとのブランドコミュニケーションを活性化する目的がある事
- Animation Tokenというオリジナルの単位を決め共通言語とすることで、意思決定コストやコミュニケーションコストを著しく低下することができる
yoshi2023/07/07
yoshi2023/07/11
yoshi2023/07/14
yoshi2023/07/20
yoshi2023/08/01
yoshi2023/08/08
yoshi2023/08/29
yoshi2023/09/05
yoshi2023/09/12
yoshi2023/09/28
yoshi2023/10/03
ダッシュボード用の React コンポーネント。Tailwind CSS で書かれている。
yoshi2023/10/05
yoshi2023/10/16
yoshi2023/10/24
yoshi2023/11/07
yoshi2023/11/14
このスクラップは2024/02/27にクローズされました