アプリケーションとUIコンポーネントを切り離し、独立した状態でコンポーネントの開発を行うことができるオープンソースツールです。 特徴 開発したUIコンポーネントをカタログとして一元管理します。 カタログ上でコンポーネン…

• JavaScript, React
• コメントを書く

[crayon-67003891db9e3729228132/] テストコード [crayon-67003891db9ea051167360/] waitFor setTimeoutの結果を待ちます。 int…

• React
• コメントを書く

昨今はtypescriptを使うのが当たり前ですのでtsに対応したjestを導入 [crayon-67003891dbcce012147692/] 追加パッケージ npm i -D jest-environment-js…

• React
• コメントを書く

昨今、回線の性能がよくなっているにせよ自分が今視覚で見ている部分から読み込んだ方が効率的という発想。いきなり画面に見えないフッターコンテンツから表示させても無駄。 wordPressにもそういうプラグインがあります。 仕組み …

• Web技術
• コメントを書く

静的コンテンツへの指定例 サイトA 36日半の指定 [crayon-67003891dc27b450075135/] must-revalidate キャッシュは期限が切れたからといって必ず再取得が行われるわ…

• Web技術
• コメントを書く

Saas Vercel ISRや、Image Optimization、CDNでの静的ファイルキャッシュといった機能を設定なしで使うことができるのでNext.js動かすならこれを使った方が楽。 というか、Next.jsの…

• Next.js
• コメントを書く

強いキャッシュ 基本的にクリアができないキャッシュになるので、HTML、CSS、JS、画像などの静的リソースに適用するのが一般的です。 Expiresヘッダー リソースのキャッシュをブラウザに指示ができる。絶対日時。この…

• Web技術
• コメントを書く

「Content Delivery Netowork」の略でコンテンツをより早く効率的に配信するために構築されたネットワークのことを指しています。 用途 全世界のユーザーに高速に安定した配信したい場合に活用できる。 特徴…

• Web技術
• コメントを書く

webP 次世代画像フォーマット。2020年後半以降のブラウザしか対応していないが今後はできるだけサイト内の画像はこれに置き換えるのは望ましい。全ての画像を置き換えるのはブラウザの対応状況からしてまだ厳しい。 AVIF …

• Web技術
• コメントを書く

0.前提を押さえる 転送量を抑えることを意識すること AWSをはじめとするクラウドサービスでは転送量ベースの課金を採用しているものが多い。無計画に配信していると馬鹿にならない金額になる。 1.クライアント側の対策 …

• Web技術
• コメントを書く