「JavaScript」タグが付いた記事一覧
Xの読み込みが爆速に！？TanStack RouterとTailwindへ移行開始
Web版のXにTanStack RouterやTailwind、SSRといったモダンなWeb技術が採用され、ページの読み込み速度が大幅に向上したことがわかりました。この変更はログアウト状態のページに展開されており、将来的にログイン状態でも適用されるようになる可能性があります。
XのWeb版が軽くなる？読み込み時間90％短縮と製品責任者
XのWeb版において読み込み時間を大きく短縮する改善が予定されていることがわかりました。
一部サイトで「polyfill.ioにはユーザー名とパスワードが必要です」と出る原因と対処法 情報は入力しないで
一部のサイトでは現在、polyfill.ioのユーザー名とパスワードの入力を求める不審なダイアログが表示されるようになっています。この画面が表示された場合、ユーザー名やパスワードは絶対に入力せずにキャンセルしてください。
Bun本体をアップデートする方法
JavaScriptとTypeScriptを実行、構築、テストできるオールインワンツールのBunをアップデートする方法を紹介します。この記事では、Bunを使ってプロジェクトの依存関係をアップデートする方法ではなく、Bunそのものをアップデートする方法について紹介します。
WindowsにNode.jsをインストールする一番簡単な方法
オープンソースのJavaScript実行環境のNode.jsをWindowsに簡単にインストールする方法をわかりやすく解説します。
ZedでColonizeのようにShift + Enterでセミコロンを挿入する
VS Codeには、カーソルが行の途中にある場合でもShift + Enterを押すことで、カーソルを行末に移動させてセミコロンを挿入してくれる「Colonize」という拡張機能があります。Zedでは、キーバインドを編集することでほぼ同じことを実現できます。
OpenAI、CodexのSlask連携やSDKを発表 新しい管理ツールも公開
OpenAIは、同社の提供するプログラミング用のAIエージェント「Codex」のSlack連携やSDK、新しい管理ツールを発表しました。また、料金プランを改定し、これまで明示的なレート制限が存在しなかったクラウド版のCodexにもCodex CLIと共有のレート制限が適用されるようになります。
Next.jsでGoogle AnalyticsやYouTube埋め込みを簡単にできる@next/third-partiesの使い方
Next.jsには、人気なサードパーティのライブラリーをパフォーマンスに配慮しながら簡単に使える公式パッケージ@ next/third-partiesが用意されています。この記事では、@next/third-partiesの使い方を解説します。
document.cookieより優秀？Cookieを簡単・安全に扱えるCookie Store APIの使い方
2025年6月、WebでCookieを簡単かつ型安全に扱えるCookie Store APIのCookieStoreインターフェースのBaselineステータスが、「Newly available」（最新のすべての主要ブラウザーで利用可能）に到達しました。この記事では、Cookie Store APIのメリットから使い方まで解説します。
トークン不要でnpmパッケージを公開できるtrusted publishingを試す
GitHubは、APIトークンを使わずにnpmに安全にパッケージを公開できる「trusted publishing」を発表しました。実際に私が管理しているすべてのパッケージをtrusted publishingに移行したため、設定方法を紹介します。
Payload CMSのライブプレビューの実装でつまづいたこと
Payload CMSは、標準でライブプレビュー機能をサポートしています。ところが、ドキュメントにしたがって実装したにもかかわらず、ライブプレビューが機能しないという問題に遭遇しました。
Astro v5.10リリース コンテンツを動的に取得できるライブコンテンツコレクションが追加
コンテンツコレクションを動的に取得できるライブコンテンツコレクションや、レスポンシブ画像の対応などが含まれるAstro 5.10がリリースされました。
HTMLに属性値をエスケープする破壊的変更が導入へ
2025年5月20日、HTML仕様が更新され、mutation XSS（mXSS）脆弱性を防ぐために属性内の<および>をエスケープするようになりました。
Node.jsにESMファイルが直接実行されたかを確認できる機能が追加
Node.js v24.2.0では、スクリプトが直接実行されたのかモジュールとして読み込まれたかを判定するimport.meta.mainが追加されました。
Cloudflare R2で「We encountered an internal error. Please try again.」というエラーが出たときの対処法
@aws-sdk/client-s3を使って、Amazon S3互換のCloudflare R2にファイルをアップロードするプログラムを書いていたところ、「We encountered an internal error. Please try again.」というエラーが発生しました。
Next.jsで最適化した画像をCloudflareでキャッシュできるようにする方法
Next.jsの<Image>コンポーネントを使うと簡単に画像を最適化できますが、これによって最適化した画像は、デフォルトではCloudflareにキャッシュされません。この記事では、Next.jsで最適化した画像をCloudflareにキャッシュする方法を解説します。
JSRのネイティブサポートを追加したpnpm v10.9がリリース
JSRのネイティブサポートを追加したpnpm v10.9がリリースされました。`jsr:`プロトコルを使うことでJSRからパッケージをインストールできるようになりました。
Chromeの最新のバージョン番号を取得するVersionHistory APIの使い方
何らかの理由でChromeの最新バージョンのバージョン番号を取得したい場合があります。Googleは、そんなときに使えるVersionHistory APIを公式に提供しています。
Next.jsに認証をバイパスできる脆弱性 直ちにアップデートを
人気なReactフレームワークのNext.jsに、認証チェックをバイパスできる脆弱性が見つかりました。今回発見された脆弱性（CVE-2025-29927 / GHSA-f82v-jwr5-mffw）は、Next.jsのミドルウェアで認証を処理している場合に、ミドルウェアをバイパスすることで認証を回避できるというものです。
styled-componentsがメンテナンスモードに移行 新規プロジェクトでは非推奨に
Reactでコンポーネントをスタイリングする際のCSS-in-JSライブラリーのひとつとして人気だったstyled-componentsが、メンテナンスモードに移行していたことが分かりました。
TypeScriptコンパイラーがGoに移植へ ビルドが10倍高速に
MicrosoftはTypeScriptをGo言語によるネイティブ実装で作り直すと発表しました。ビルドが10倍高速になり、メモリー使用量が大幅に削減される見込みです。
Create React Appがついに非推奨に 移行先としてNext.jsやRemixが推奨
025年1月29日、Reactプロジェクトの立ち上げに広く利用されてきたCreate React App（CRA）が正式に非推奨となりました。以前から「CRAが非推奨になるのではないか」という噂が広まっていました。
Popover APIで背景の要素をクリックできないようにする方法
HTMLのPopover APIを使うと、JavaScriptを使わずにHTMLのみでポップオーバーを実装できます。しかし、ポップオーバーを表示しているときでもポップオーバー以外の部分はクリック可能な状態になっています。
Node.jsがTypeScriptの実行をサポート！v23.6.0でデフォルトで有効化
TypeScriptのサポートがデフォルトで有効化されたNode.js v23.6.0がリリースされました。Enumなどの一部の機能を除くTypeScriptの基本的な機能を、ts-nodeやtsxなどのサードパーティのライブラリーなしで実行できるようになりました。
CORESERVERでThreadPoolBuildErrorが出た場合の対処法
CORESERVERでビルド中にThreadPoolBuildErrorが発生した場合の対処法について解説します。
ESLintでTypeScriptベースの設定ファイル（`eslint.config.ts`）を使えるようになった
2024年8月10日、TypeScriptで書かれた設定ファイルを実験的にサポートするESLint v9.9.0がリリースされました。これにより、TypeScriptによる入力補完の恩恵を受けながら、ESLintの設定ファイルを書けるようになります。
Astro v4.11リリース！コードブロックや500エラーページの改善など
オープンソースの静的サイトジェネレーター「Astro」のバージョン4.11がリリースされました。このリリースでは、500エラーページの改善や、<Code />コンポーネントにおけるShikiトランスフォーマーの扱いの改善などが含まれています。
Material Web Componentsがメンテナンスモードへ 新機能の開発は中止もプロジェクト継続を模索中
Googleが開発する「Material Web Components（MWC）」が、メンテナンスモードに入ることが発表されました。Material DesignチームがGoogleの大規模内部フレームワーク「Wiz」のサポートに集中するため、MWCに割り当てられていたエンジニアを再配置したことが原因とのことです。
Astro v4.10リリース！型安全な環境変数を実験的にサポート
オープンソースの静的サイトジェネレーター「Astro」のバージョン4.10がリリースされました。このリリースでは、新しい型安全な環境変数のサポートや、コンテナーAPIの強化、全HTTPメソッドに対応したリライト機能など、多くの新機能が追加されています。
Astro v4.9リリース！コンテナーAPIやReact 19のサポートなど
オープンソースの静的サイトジェネレーター「Astro」のバージョン4.9がリリースされました。このリリースでは、新しいコンテナーAPIの追加、React 19のサポート、安定化された実験的機能などが含まれています。
Astro v4.8リリース！Astroアクションやリクエストの書き換え機能など
Astro v4.8がついにリリースされました。このバージョンでは、実験的な機能としてAstroアクションやリクエストの書き換えが導入され、さらに性能向上や複数ルートの同一エントリポイント定義も可能になりました。
Node.js v22でimport assertionsが廃止された件
Node.js v22でimport assertionsが廃止された件について、日本語の記事が見当たらなかったのでまとめてみました。
Astro v4.7リリース！開発ツールバーの改善やアップデートチェッカーなど
Astro 4.7がリリースされました。このバージョンでは、開発ツールバーAPIの大幅な改善、Astroを最新バージョンに保つためのアップデートチェッカーなどが含まれています。また、TypeScriptのプリセットで通常のJavaScriptの使用が許可されました。
Changesetsでnpmへのリリースを自動化する
最近、筆者が管理するいくつかのGitHubリポジトリーにChangesetsを導入しました。これによってnpmへのリリース作業を自動化でき、負担が減りました。この記事では、Changesetsを導入する手順を詳しく解説します。
node-tar v7で破壊的な変更が加えられた件
node-tar 7では、従来のコードが動作しなくなる破壊的な変更が含まれています。この記事では、どのような変更が加えられたのか、既存のコードをどのように変更すればよいのかについて解説します。
WindowsにBunをインストールする方法
2024年4月1日、Windowsに対応したBun 1.1がリリースされました。この記事では、WindowsにBunをインストールする方法を説明します。
AstroにYouTubeを埋め込む「astro-embed-youtube」の使い方
AstroでYouTubeの通常の埋め込みコードを使用すると、ページの読み込み速度が低下してしまいます。この記事ではパフォーマンスを維持しながらAstroベースのサイトにYouTubeを埋め込める「astro-embed-youtube」を紹介します。
Markdownで簡単改行！remark-breaksプラグインの使い方
Markdownで（改段落ではなく）改行するには、行末に半角スペースを2つ入れるか、<br/>タグを使用する必要があり、煩わしさを感じさせます。remark-breaksは、このような問題を解決する、remark.jsのプラグインです。
ESLintでTypeScriptのクラスのpublicやprivateを強制する方法
この記事では、ESLintと@typescript-eslintプラグインを使用して、TypeScriptのクラスメンバーに対するアクセシビリティ（public、protected、private）の明示を強制する方法について解説します。
既存のFigmaプラグインをDynamic Page Loadingに対応させる
私は「Smart Chroma」というFigmaプラグインを開発しています。先日、Figmaから「ファイルの読み込み時間を短縮するdynamic page loadingをロールアウト中だからプラグインを新しいAPI対応させてね」というメールが届きました。ということで、今回は公式のガイドに従いながら、既存のFigmaプラグインをDynamic Page Loadingに対応させる方法を紹介します。
Rust製のJavaScriptバンドラー「Rolldown」がオープンソースとして公開
JavaScriptのビルドツール「Rolldown」がオープンソースとして公開されました。Rolldownは、高速なビルドツールのViteの将来のバンドラーとして開発された、Rust製のJavaScriptバンドラーです。この記事では、Rolldownについて深掘りします。
Markdownに広告を挿入するプラグイン「rehype-auto-ads」
Markdownで作成した記事に自動的に広告を挿入する「rehype-auto-ads」というrehypeプラグインを開発しました！この記事では、rehype-auto-adsを開発した経緯や使い方について詳しく説明します。使い方だけ読みたい方は、そこまで飛ばしていただいて構いません。
Astroでカスタマイズ可能な目次を生成する「astro-custom-toc」
Astroでカスタマイズ可能な目次を生成するAstro integration「astro-custom-toc」を作りました！この記事では、astro-custom-tocの使い方や他のプラグインとの違い、カスタマイズ方法などについて説明します。
Polyfill.ioが中国企業に売却 背景と対応策は？
Web開発者たちにとって、ブラウザー間の互換性問題は長年にわたり頭痛の種となっています。そんな中、Polyfill.ioは多くの開発者にとって救世主のような存在でした。しかし、この度Polyfill.ioは中国の企業Funnullに売却されたことが明らかになり、開発コミュニティーに波紋を広げています。この記事では、Polyfill.ioの売却について、またWeb開発者が取るべき対策について詳しく解説します。
Googleがファイル識別AI「Magika」をリリース 使い方を解説
Googleが2024年2月15日に発表した「Magika」は、AI技術を活用したファイルタイプの識別システムです。Googleのディープラーニングモデルを駆使し、バイナリやテキストファイルの種類を高速かつ高精度に判定します。この記事では、Magikaの概要から使い方まで、詳しく解説します。