JavaScriptの日付処理が変わる！ DateからTemporalへ - ICS MEDIA
JavaScriptで日付を扱ったことのある方なら、「3月のつもりでnew Date(2026, 3, 15)と書いたら4月になっていた」という経験が一度はあるのではないでしょうか。月だけが0始まりであることはDateクラスの仕様の一例ですが、そのほかにも、日付の計算やフォーマット、タイムゾーンの処理には手間がかかります。そうした扱いづらさを補うために、長らくdate-fnsやDay.jsといったライブラリが利用されてきました。 その状況を変えるのが、Dateクラスを置き換えるために一から設計された新しい標準API「Temporalテンポラル」です。2017年ごろから議論が始まった提案で、仕様はすでに固まり、ECMAScript 2027に採用される予定です。ライブラリの使い方と違って、標準APIの知識は一度覚えれば長く使えます。Dateの課題を振り返ったうえで、Temporalの使い方と
Declarative Partial UpdatesをストリーミングSSRに使う
Declarative Partial Updates （宣言的部分更新） は、Googleによって提案されているWeb標準（候補）です。詳しくは以下のページをご覧ください。 GoogleのWeb標準というと、他のブラウザベンダーのサポートを得られないまま突っ走ることも多い印象ですが、このDeclarative Partial Updates（略してDPU）は、FirefoxとWebkitからも肯定的な反応が得られているようです。その意味で期待が持てるWeb標準です。 DPUは関連する新しいJavaScript APIなども含んでいますが、今回は例によって、JavaScript無しでHTMLを後から更新できる点に注目します。 Declarative Partial Updatesの機能 Webサイトを表示するときは、HTMLがWebサーバーからストリーミングされてきます。Webブラウザは、
プラットフォームを超えて：Vercelはプログラミング言語の未来を設計しているのか？
Vercelは最近、単なるプラットフォームの機能強化にとどまらない新機能を展開しました。これらの機能は、JavaScriptのセマンティクスそのものに挑戦し、プログラミングの新しい時代の到来を垣間見せてくれます。賛否両論を巻き起こしてはいるものの、これらはVercelのより広く、野心的なビジョンを示唆しています。 Vercelが提唱するのは、次世代のプログラミング言語は、異種ランタイム、透過的なネットワーク、多層キャッシング、タスクの永続性など、現代のアプリケーションが持つ複雑さをネイティブに管理すべきだという考えです。 この記事では、プログラミング言語が単なるロジックだけでなく、分散システムにおけるデータと計算のライフサイクル全体を管理するために、どのように進化していく可能性があるのかを探ります。この進化は、シリアライズ可能なクロージャ、代数的エフェクト（Algebraic Effect
Node.jsでネイティブにTypeScriptを実行できる「Type Stripping」機能が安定版に到達。Node.js v25.2.0
Node.jsでネイティブにTypeScriptを実行するための機能「Type Stripping」が、11月11日にリリースされた新バージョン「Node.js v25.2.0」で安定版になったことが発表されました。 これにより本番環境などでもType Stripping機能を用いたTypeScriptファイルの実行が安心してできるようになりました。 Node.jsはTypeScriptをサポートしていなかった Node.jsはもともとサーバサイドのJavaScriptランタイムとして開発されたため、JavaScriptのスーパーセットであるTypeScriptの型指定や高度な命令などには対応していません。 Node.jsでTypeScriptファイルを実行するには、TypeScriptトランスパイラを用いてJavaScriptに変換するなどの方法があります。 この方法を用いたts-nod
TreeShakableなResultライブラリを作りました
はじめに JavaScriptでは、throwを使ってエラーを明示的に投げることで、処理を中断する「大域脱出」が可能です。しかし、TypeScriptではこのthrowによって発生するエラーの型を記述できないため、型安全性が損なわれてしまいます。 この問題を解決するために、関数の成功・失敗を明示的に扱えるResult型が有用です。 TypeScriptでResult型を利用する場合、neverthrowやeffect-ts、fp-tsなどのライブラリがよく挙げられます。 しかし、それぞれ一長一短があり、neverthrowは比較的シンプルで使いやすいものの、現在は活発なメンテナンスが行われておらず、複数のPRが長期間放置されています。 effect-tsやfp-tsは高機能ですが、Result以外の多くの概念も含んでいるため、「Resultだけ欲しい」ケースでは導入コストが高く、バンドルサ
2025年のReactとコミュニティの現状 | POSTD
Reactがこれまでどのように開発されてきたかについての詳細な考察と、コミュニティでよく見られる混乱や懸念事項についての説明 はじめに 今日、Reactとそのエコシステムの状況は複雑で分裂しており、成功、懐疑、そして論争が入り混じっています。 ポジティブな面として、Reactは最も広く利用されているUIフレームワークであり、そのコンセプトはJSエコシステムの他の部分にも影響を与えてきました。Reactチームは数年にわたる開発の末、先日React 19をリリースしました。これは、公式に安定版となったReact Server Componentsのサポート、Promiseを扱うための新しいuseフック、複数の新しいフォーム連携、そして長らく非推奨であった多くの時代遅れな機能の削除を含む、大規模なリリースでした。 しかし、私が観察し、また経験してきたところでは、Reactコミュニティでは、Rea
Denoのフロントエンド開発の動向【2025年夏】
以前に以下のような記事を書きました。 上記記事の公開から一年以上が経過し、その間にDenoにおけるフロントエンド開発に関する様々なアップデートがありました。この記事では重要そうな話題に限定していくつか紹介いたします。 Deno本体のアップデート Deno v2の正式リリース付近のタイミングから、Deno本体でフロントエンド関連の機能の拡充が少しずつ進められています。 deno bundleコマンドの再導入 deno bundleコマンドがDeno本体に再導入されています。 Deno v1におけるdeno bundleコマンド Deno v1にはdeno bundleというコマンドがありました。ただし、Deno v1の時点におけるdeno bundleコマンドはwebpackやesbuildなどの高機能なバンドラーを置き換えることを想定したものではありませんでした。deno bundleコマ
Learn Yjs by Jamsocket
Welcome to Learn Yjs — an interactive tutorial series on building realtime collaborative applications using the Yjs CRDT library. This very page is an example of a realtime collaborative application. Every other cursor in the garden above is a real live person reading the page right now. Click one of the plants to change it for everyone else! Learn Yjs starts with the basics of Yjs, then covers te
JavaScriptのイテレータ, イテラブル, ジェネレータを理解する！
お久しぶりです。GMOインサイトの天河です。 ついこの間、JavaScriptのジェネレータについて社内勉強会で発表したのでその内容をまとめます。 ※ 注意 本記事で言及している「ジェネレータ」はJavaScriptでの言語仕様です。一部通ずる箇所もあると思いますが、Python や C# など他の言語での使われ方についてはしかるべき文献を見てください。 目的 ジェネレータ が何かわかるようになる ジェネレータについて面接で聞かれても余裕で答えられるようになる 実装時にジェネレータを選択肢として持てるようになる 対象読者 ジェネレータ が何か全くわかっていない人 ジェネレータ について認知はしているものの、どういうものかは把握していない人 ジェネレータ を知ってはいるものの、使い所がわからない人 はじめに ジェネレータを理解するためには、「イテレータ」と「イテラブル」について知る必要があり
Web 標準と、その限界
JavaScript、たくさんバックエンドで使われてますよね、あなたも使ったことはありませんか？ そんな バックエンドでも使われている JavaScript。そこに標準で組み込まれている Web 標準な API 。それを考えていきます。 Web 標準 とは何か Web を構成するための技術として、主に HTML/CSS/JavaScript があります。 どのブラウザでサイトを見ても同じ結果が得られるように、その HTML/CSS/JavaScript をまとめている仕様のことです。 例えば、 HTML の仕様は HTML Living Standard が主流で、 WHATWG という団体が決めています。 JavaScript では、構文や基本的な機能 (Arrayなどの言語使用) は ECMA という団体が ECMAScript を策定しています。この中にはfetchは含まれていないの
チュートリアル: Yjs, valtio, React で実現する共同編集アプリケーション - ROUTE06 Tech Blog
Yjsは、リアルタイム共同編集を実現するためのアルゴリズムとデータ構造を提供するフレームワークです。Notion や Figma のように、1 つのコンテンツを複数人で同時に更新する体験を提供することができます。 Y.Map, Y.Array, Y.Text といった共有データ型を提供し、それらは JavaScript の Map や Array のように利用できます。さらにそのデータに対する変更は他のクライアントに自動的に配布・同期されます。 Yjs は Conflict-free Replicated Data Types (CRDT) と呼ばれるアルゴリズムの実装であり、複数人が同時にデータを操作してもコンフリクトが発生せず、最終的に全てのクライアントが同じ状態に到達するように設計されています。 クイックスタート Y.Map がクライアント間で自動的に同期されるコード例を見てみましょ
巷の「ReactとNext.jsの比較」はここがおかしい、というか比較すること自体が微妙 - honey32
(WIP まとまったら Qiita とかに上げるかも) TLDR; 「React と Next.js を比較」という記事で、 Next.js と比較できるのは「フレームワークなしで React を使うという選択肢」であって、「React そのもの」ではない。 ✅️ React を使うのに 「フレームワークあり」 vs 「フレームワークなし」 ❌️「React」 vs 「Next.js」 それはそうと、「create-react-app の機能・特徴」のことを、「React の機能・特徴」であるかのように書いてしまっている記事が多い create-react-app 自体が擬似的なフレームワーク（といえそう） そもそも、create-react-app は今は更新されてないので create-vite を使うべき フレームワークあり or フレームワークなし 【フレームワークあり】 Reac
フロントエンドのスピードに置いていかれたので、よく聞く技術を調べて分類してみた
元フルスタックエンジニア(死語)をやらせていただいていたものです。 JavaScript(TS)周りの進歩が凄く、あまりにもついていけていなかったので、気になったワードを片っ端から整理してみました。 それぞれに対する説明の正しくないものが含まれてしまっている可能性があります。 そんなところを見つけたときは優しく教えてくださると助かります。 各ツールの詳細というよりは、それぞれがどんな役割のものなのかを記載しています。 この記事が誰かの助けになれば幸いです。 調査・分類した言葉(技術)たち Hono Bun Deno Biome Vite Webpack Turbopack esbuild Babel SWC Prisma まず上記に上げたものが、どういった機能を持つものなのかもわかりませんでした。 それを整理すると以下になるようです。 JavaScript Runtime Deno Bun
もうjsなんていらない！世界で流行っているHTMXについてまとめてみた - Qiita
はじめに この記事の内容はhtmx v1の記事です。 最新のhtmx v2に関する解説は以下の本にまとめましたので、そちらを参考にしてください！！ HTMXとは https://htmx.org/ HTMXは、JavaScript を記述せずに、Ajax通信や高度なUXを実現できるライブラリ。 軽量 で 高速 で、既存のサーバーサイドのフレームワークとシームレスなやり取りができる。また、AJAX通信の発火、フォームの送信処理、DOMの更新などを既存のHTML要素を拡張するだけで可能とする。WebSocketやSSEにも対応しているので、チャットアプリなどにも適している。 2023 JavaScript Rising Starsでは、 フロントエンド・フレームワーク部門で見事2位に輝いた！(一位はReact、全部門だとshadcn/ui) 似たような機能として、Ruby on RailsのH
「Raspberry Pi Pico」向けのJavaScriptランタイム、Kalumaを使ってみた
今回はPythonやC、C++でのプログラミングが主流の「Raspberry Pi Pico」でJavaScriptを使えるようにする「Kaluma」を紹介します。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
modern-frontend-design-pattern
Figma + Storybook + PlaywrightのMCPを使ったフロントエンド開発
MDwiki - Markdown based wiki done 100% on the client via javascript
ウェブエンジニアでもWasmを使いたい!
【JavaScript】querySelector よりもパワフルに DOM からノードを取得しよう！【XPath】 - Qiita
