「CAREER SKILLS」はジョン・ソンメズ著の650ページを超える技術者向けキャリアガイドです。エンジニアとして4年目を迎え、成長の停滞を感じていた筆者がこの本から学んだ内容をメモ形式で共有します。

本記事では、BroadcastChannel APIを活用して同一オリジン内の複数タブ間で即時に情報共有できる仕組みを解説しています。外部認証後、認証画面から親タブへ通知しUI更新を実現する例を、JavaScriptやReactのコードサンプルと共に紹介。さらに、ブラウザ互換性やセキュリティ対策、認証状態共有やカート同期などの応用例にも触れ、シンプルかつ保守性の高い実装がユーザー体験向上に寄与する点を強調しています。

この記事では、Reactにおけるinline styleのパフォーマンスについて、MUIのベンチマークツールを使用して検証を行った。結果から少なくともパフォーマンスの観点からinline styleを避けるべきという指摘は適切ではない可能性が示唆された。ただし、この結果はスタイリングの条件によって変わる可能性があることには留意が必要である。

ブログのパフォーマンス改善、特にLCP（Largest Contentful Paint）の最適化について解説した記事。Lighthouseでの測定により、2.9MBの背景画像がボトルネックとなっていることを特定。Astroのastro:assets機能を活用し、WebP形式への変換や自動サイズ計算を実施。さらに、レスポンシブ対応と画質最適化により、画像サイズを230kBまで削減。結果として、モバイル・デスクトップ両環境でLighthouseスコア100点を達成。画像最適化における具体的な実装方法と、その効果を示している。

pnpm add linkやyarn add linkを使うとローカルにクローンしたライブラリを直接アプリ側で使うことができ、簡単にデバッグすることができる。

「CAREER SKILLS ソフトウェア開発者の完全キャリアガイド」という本をきっかけに、ブログを作ってみたら驚くほど簡単に5分ほどでデプロイできた。この記事では、その技術スタックと手順について解説する。今回使った技術は、AstroとCloudflare Pagesの2つ。Astroは静的サイトジェネレーターで、Markdownをそのまま記事にできる「Content Collections」が特に便利。これのおかげで素早くブログが構築できた。また、Cloudflare Pagesはデプロイが非常に簡単で、コストもかからない。深く調べずに選んだが、結果的に「当たり」だった。ブログ作成の流れはシンプルで、まずAstroをインストール。pnpm create astro@latest で新規プロジェクトを作成し、テンプレート選択時に「ブログテンプレート」を選ぶのがポイント。次にGitHubにプッシュ。GitHubにリポジトリを作り、プロジェクトをプッシュする。最後にCloudflare Pagesと連携し、アカウントを作成してGitHubリポジトリを接続し、自動デプロイするだけ。これで簡単にブログが公開できる。今後はデザインのカスタマイズやSEO強化、画像配信の最適化などを進めつつ、継続的にブログを更新していきたい。