You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert

AIにフロントエンドのコードを書かせると、一昔前の書き方をされて困ることがよくあります。 私のAIの使い方が悪いというのは前提にありつつ、最新の書き方を選んでくれないことが何度もあります。たとえばCSSではSubgridを使ってほしい場面でわざわざ古いGridのネストを書いてくる。JavaScriptではObject.groupByで済むグループ化をreduceで書いてくる。さらに当たり前品質として押さえるべきアクセシビリティが漏れたり、最新のセキュリティ対策が抜けたコードを書いてくることもあります。これはサービスの品質低下に直結します。 5/19にGoogle公式がGoogle I/Oで発表した「Modern Web Guidance」のスキルを使えば、Claude CodeやCodexといったAIエージェントが最新のWeb機能で書けるようになります。フロントエンド開発をするならぜひ導入

この記事はJavaScriptCoreにおける using / await using 構文の実装について、特にバイトコードの生成に焦点をあてて解説するものです。 該当のコミットは以下の二つです: https://commits.webkit.org/308955@main https://commits.webkit.org/309389@main using / await using 構文とは using / await using 構文は、現在Stage3のExplicit Resource Managementプロポーザルによって導入されるECMAScriptの新しい構文です。ファイルハンドラやネットワークのコネクションなど、ライフタイムを持つリソースを明示的に管理するための機能です。 using と await using は var let const に次ぐ新たな変数宣言の

Sponsored · SiteGround - Reliable hosting with speed, security, and support you can count on. →

fetchのキャンセルだけじゃない！　AbortSignalで実現するクリーンなJS非同期処理 イベント監視やリクエストのクリーンアップはウェブ開発で軽視されがちな処理のひとつです。一般にフロントエンドではページを閉じれば全てブラウザーが後片付けをしてくれるので、こうした処理はもれやすく、気づいていても対処されないこともままあります。しかし、長時間操作しても不整合を起こさずに軽快な操作性を維持したり、サーバーの負荷を軽減したりするためには、クリーンアップを正しく行う知識が不可欠です。 JavaScriptにはAbortSignalとAbortControllerという仕組みがあり、処理の中断や監視の解除といったクリーンアップの処理を統一的に行えます。AbortSignalは元々Fetch APIの処理を中断する方法の議論から生まれたものですが、ウェブ開発のさまざまな場面で使える汎用的な仕組

IME利用者のEnterが暴発しないようにisComposingで防ぐ 海外製Webサービスを利用すると、日本語変換の確定時（Enter押下時）に入力途中のデータがSubmitされてしまうことが多々ある。GitHubのIssue/PRのタイトルしかり、ChatGPTの入力欄しかり。 Enterでフォームを送信するのはWebの標準的な挙動だが、IME利用者（主に日本/韓国/中国語話者など）にとって非常に不便なので変換確定時のEnterのイベントを無効化する処理が必要になる。 そんなときに使えるのがKeyboardEvent.isComposingやElement#compositionstartイベント、Element#compositionendイベントだ。 <form> <label for="title">Title</label> <input id="title" type="te

2026年3月に Reporting API というWeb標準 API が Baseline に到達し主要ブラウザで利用可能になりました。 今回はこの便利な Reporting APIを実際に使ってみて、できることやユースケースについて考えてみます。 Reporting API とは Webアプリケーションを運用していると、こんな問題に遭遇したことはないでしょうか。 本番環境でだけ CSP 違反が起きているが、ユーザーからの報告がない限り気づけない 使っている API がいつの間にか非推奨になっていて、将来のブラウザアップデートで壊れるかもしれない ブラウザが勝手に動画の自動再生をブロックしたが、ログに残っていない これらはすべて ブラウザ側で発生するイベント であり、従来のサーバーサイドの監視では捕捉できないものです。 このような場面で役に立つのが、Reporting API です。 R

Some things in programming make me feel at peace with the world. One such thing is the pipeline (or pipe) operator. It’s so simple, but so elegant. Today, I will act as your local functional programming hype-man, and go over how it works and why it’s great (for the uninitiated). The pipe operator is a staple in languages like Elixir and OCaml, but curiously, the first place we can really take a lo

Webナビゲーションの歴史 Webのナビゲーションは単なる技術的な進化ではなく、ユーザー体験と開発モデルの変化とともに再設計されてきた。URLや履歴、画面状態をどのように一致させるかという問題への解答の変遷だ。 Webの初期 Webの初期は、文書閲覧システムとして設計された。 ページごとにひとつのURLが割り当てられ、ユーザーはハイパーリンクをクリックしてページを移動していた。そのため、ページ遷移の際は常にフルリロードが行われた。 <a href="./toc.html">Table of Contents</a> <a href="./about.html">About me</a> Ajaxの登場 2000年代前半にXMLHttpRequestが登場し、URLはそのまま（ページ遷移しない）でページの一部を更新できるようになった。 しかし、画面の状態とURLと履歴が分離した。（代表的なサ

Today we are incredibly excited to open source Edge.js, a JavaScript runtime specifically designed to safely run Node.js workloads for AI and Edge computing. The goal is simple: run your existing Node.js applications safely and with density and startup times that are impossible to get with containers. Edge.js takes a different approach from existing JS edge runtimes like Deno or Cloudflare Workers

"Safe, reliable, and intuitive user interfaces are critical for our customers who depend on OTIV products to drive the future of rail automation. Slint has been an exceptional partner in helping us achieve this, providing the high-performance UI solutions we need to stay at the forefront of innovation." Sam De Smet, Co-Founder OTIV is pioneering rail automation through technology for assisted, rem

Welcome to our blog! I'm Jason Williams, a senior software engineer on Bloomberg's JavaScript Infrastructure and Terminal Experience team. Today the Bloomberg Terminal runs a lot of JavaScript. Our team provides a JavaScript environment to engineers across the company. Bloomberg may not be the first company you think of when discussing JavaScript. It certainly wasn't for me in 2018 before I worked

PlanetScale Postgres is the fastest way to run Postgres in the cloud. Plans start at just $5 per month. Learn more By Sam Lambert | March 3, 2026 I am excited to announce that the Drizzle team is joining PlanetScale to continue their mission of building the best database tools for JavaScript and TypeScript. Drizzle’s ORM has risen to become the default thanks to the team’s obsession with performan

I scattered my thoughts on Twitter, so I'll organize them briefly here. Introduction & Premise First, as a premise, I am very much in favor of the approach of using a compiler for optimization. This approach is often effective for improving DX without breaking the interface, and I myself use a framework that emphasizes this. However, I have some questions about the mental model changes (or unifica

最近、Next.jsがどのようにCSRF対策をしているのかを考える機会がありました。 そんななかで色々と学んだことを今回は書きます。 CSRFとは 本題に入っていく前に、いま一度CSRFについて改めて復習しておきましょう。CSRF(Cross-Site Request Forgery)とは、ユーザーが意図しないリクエストを攻撃者が勝手に送信させる攻撃です。以下に攻撃の一連の流れを可視化しています。 sequenceDiagram participant User as ユーザー participant Bank as 銀行サイト (bank.example) participant Evil as 悪意のあるサイト (evil.example) User->>Bank: ログイン（セッションCookieを取得） User->>Evil: 悪意のあるページを開く Evil->>User: 自