Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
Intlのここ数年とこれから
Search
Sponsored
·
SiteGround - Reliable hosting with speed, security, and support you can count on.
→
Saji
September 11, 2026
Technology
53
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
Intlのここ数年とこれから
#tpac_study
-
https://cybozu.connpass.com/event/402843/
X
-
https://twitter.com/sajikix
Saji
September 11, 2026
More Decks by Saji
See All by Saji
本当はややこしい日時のFormatPattern
sajikix
0
450
tpac_study (2026)
sajikix
0
380
業務に残された「良くない型」で考える「TypeScriptの難しさ」
sajikix
4
9.5k
It’s “Time” to use Temporal
sajikix
3
800
ユーザーが作成したコードをブラウザ上で安全に実行できる Plugin システムへのアプローチ
sajikix
1
900
Branded Typesで日時の複雑さと戦う
sajikix
4
1.3k
推しProposalと広がる夢~Intl.MessageFormatとDomLocalization~
sajikix
2
870
自作JSエンジンに推しプロポーザルを実装したい!
sajikix
1
390
Lookback TypeScript ESM support and what should we do now.
sajikix
5
850
Other Decks in Technology
See All in Technology
From Developer Experience to Agentic Experience: The Next Evolution of APIs
benjagm
0
110
Refining Active Record
shugo
0
190
その Valkey 使いこなしていますか?
onk
PRO
5
1.8k
AWSセキュリティで活用するAI機能
cmusudakeisuke
1
190
『SAR衛星データ解析入門』のご紹介とその応用
syuchimu
0
140
ストレスなくAIと付き合いたい!こんなときどうしてる?
namiki64
4
670
「私が一番顧客に詳しい」を捨てる~ 全員が一次情報に精通する開発チームをつくり、PMが次のボトルネックへ染み出すまで
kaminashi
3
1.2k
AIネイティブ企業への変革。パーソルキャリアが挑む「データメッシュ×ガバナンス」のアーキテクチャ戦略
techtekt
PRO
0
120
Code for Security プロジェクト紹介 2026年10月
yu23ki14
0
120
Post AI時代のリファクタリング実践記 / Refactoring in the post AI era
kaminashi
1
320
AI駆動開発における開発環境のセキュリティの考え方
yamahiro
0
330
こんにちは!SORACOM です & IoT とは【SORACOM UG 東北 in 八戸】
soracom
PRO
0
170
Featured
See All Featured
Prompt Engineering for Job Search
mfonobong
0
530
Fantastic passwords and where to find them - at NoRuKo
philnash
53
4k
CoffeeScript is Beautiful & I Never Want to Write Plain JavaScript Again
sstephenson
162
16k
Building an army of robots
kneath
307
47k
Chasing Engaging Ingredients in Design
codingconduct
0
370
What Being in a Rock Band Can Teach Us About Real World SEO
427marketing
0
1.1k
No one is an island. Learnings from fostering a developers community.
thoeni
21
3.9k
Stop Working from a Prison Cell
hatefulcrawdad
274
21k
Improving Core Web Vitals using Speculation Rules API
sergeychernyshev
21
1.7k
Optimizing for Happiness
mojombo
378
71k
How People are Using Generative and Agentic AI to Supercharge Their Products, Projects, Services and Value Streams Today
helenjbeal
2
370
A designer walks into a library…
pauljervisheath
211
25k
Transcript
# 替え玉.web Intlのここ数年とこれから Ryusei Sajiki / @sajikix
𝕏 Saji / Ryusei Sajiki Frontend Developer at Cybozu, inc.
@sajikix
遡ること3年前
JSConfJP 2023のセッションにて ※ちなみに初カンファレンス登壇
替え玉って ?
ここ数年 Intlの今までとこれから Ryusei Sajiki / @sajikix
ここから2023年までの 振り返りパート ※かなり早く進むので注意
1. Intlとは
もうちょっと具体的に JavaScriptの国際化APIの名前空間(Intl.〇〇) 以下のように言語に依存した機能を提供する • 日時・数値のフォーマット • ロケールの解決 • 言語に依存した文字列の比較 •
テキスト区切り・複数形の判別
Intlの仕様的な位置付け JavaScriptの仕様であるECMA-262の「拡張仕様」という位置付け。 ECMA-262とは区別してECMA-402という仕様番号がついている。 Proposalの管理や会議にも分けて進められている ECMA262 ECMA402 (Intl) 自分たちがJavaScriptの仕様と捉えているもの
IntlのAPI概要 Intlは2つのメソッドと9つのコンストラクタプロパティを持っている • メソッドは補助的なものでメインの機能はコンストラクタプロパティ経由 よく使うコンストラクタプロパティ • ✨Intl.DateTimeFormat() • ✨Intl.NumberFormat() •
Intl.RelativeTimeFormat() / Intl.Segmenter() / Intl.PluralRules()
IntlのAPI概要 全てのコンストラクタプロパティはlocaleとOptionの2つを引数に取る • Locale : 使用するlocale。言語タグかLocaleオブジェクトで指定。 • 例 : “ja-JP”,
“en-US” • Option : formatなどにおけるオプション。 • 例 : {calender : "japanese"} (使用する暦を和暦にする) コンストラクタを初期化する際にロケールとフォーマットなどのオプションを指 定するのがポイント
他にもあるIntlの便利な機能 Intl.RelativeTimeFormat() • 「明日」や「おととい」のような相対的な日時表記の国際化を行う Intl.Segmenter() • 文字・単語・文ごとの分ち書きを行う Intl.PluralRules() • 言語ごとの複数形ルール分類や序数(1st,2nd…)を返す
2. Intl策定までの歴史
18th meeting of TC39 (2010/9) GoogleのNebojša Ćirić氏とJungshik Shin氏によって提案された
初版完成までの道のり 2010/09 Intlの元となる提案がTC39のMeetingでされる 2010/11 最初の国際化API Meetingが開催 2011/01 Strawman proposal v0.5が公開
第2~5回の国際化Meeting (名前空間の統一・機能の削減・周辺仕様との調整 ..etc) 2011/07 2012年6月での仕様策定を目指すことになる 2011/10 最初のDraft Spec (この辺りである程度仕様を固める) Draft Specの改善作業・実装作業 (名前空間の名前変更・APIの修正 ..etc) fi 2012/08 最後のDraft Speci cation
そして2012年12月
1st Edition 公開!🎉
3. Intlのこれまでの進化
🎉 2016年、初版で提案された API群が一通り使えるように!
1st Edition ~ 2023までの機能追加 + Intl.getCanonicalLocales() + formatRange() + Intl.ListFormat
+ DateTimeFormat option + Intl.Segmenter + NumberFormat option(v3) + Intl.DisplayNames … and more + Intl.PluralRules + Intl.RelativeTimeFormat + Intl.Locale + formatToParts()
4. Intlに関連する仕様たち
Intlとの関連仕様 : 全体像 ISO IETF (通貨コード) BCP47 Intl LDML/ CLDR
IANA (Timezone) Unicode
ここまでが2023年
3年経ってどうなった?
2023年当時の「これから」
2023年当時の「これから」
3年後の答え合わせ • Intl Local Info API(Stage3) → ES2026で採用 🎉 •
Intl.DurationFormat(Stage3) → ES2025で採用 🎉 • Temporal → ES2026のカットオフこそ逃したがES2027で入る 🎉 • Intl.MessageFormat(Stage1) → Intlはまだ / CLDRでは固まりつつある • Intl.Segmenter → もう少しでBaseline Widely Available になる
Intl Locale Info Intl.Localeで取得できるロケール情報が増えた! • getWeekInfo : 週の情報(週始まり、週末の曜日、年の最初の週に必要な最小日数)を返す • getTextInfo
: テキストの方向情報を返す • getCalendars : 一般的に使用されるすべての暦を、優先度の高い順に返す • getCollations : 文字の称号順序規則を返す • getHourCycles : 24時制 / 12時制どちらかなとを返す • getNumberingSystem : 一般的に使用されるすべての記数法を、優先度の高い順に返す • getTimeZones : 対応しているタイムゾーンを返す
Intl.DurationFormat 時間の間隔表記をフォーマットできるようになった • 例) 1時間30分 / 1 hour 30 minutes
new Intl.DurationFormat("fr-FR", { style: "long", }).format({ hours: 1, minutes: 46, seconds: 40, }); // => "1 heure, 46 minutes et 40 secondes"
Temporal みなさんご存知(?)JSの新しい日時操作の組み込みAPI • Dateのつらみを解消する新しい設計 + タイムゾーンと暦サポート 詳しくはぜひ temporal̲studyの資料をみてください
TemporalとECMA402 Temporalのうち以下の部分はECMA402側の仕様 • 非ISO( 非グレゴリオ)な暦のサポート • 時代・月コードの標準化 • 日時の書式化(Intl.DateTimeFormat連携) 外からmeetingNoteを追ってる人の感想として
• ここ数年で一番骨の折れる作業だったのでは?(ハイライトとも言えそう)
Intl.MessageFormat Proposal ICU MessageFormatを解釈し、フォーマットする機能の提案(推しProposal) • JS側(=Intl)としてはstage1のまま • が、Unicode側のMessageFormat v2の仕様はほぼ固まってきてる •
CLDR-TC側でコア仕様は策定し、CLDR47でStableへ • 今後の進捗が楽しみですね! • c.f. Intl.MessageFormat 基礎 / MessageFormat v2 の記法をみてみよう
Intl.Segmenter 文字列を文 / 単語 / 書記素で分割できる。 • 特に「書記素単位分割」が便利 • JSで「1文字」を判定するのはかなり面倒(異体字セレクタ
/ 結合文字/ZWJ) • Segmenterがあればいわゆる「1文字」ごとの分割が可能に 実はFireFoxの実装が遅れてv125(2024/04)でshipした → そろそろWidelyAvailableになる(=30ヶ月経つ)のでプロダクトでも使えそう
2026年から見たこれから
注目Topic この3年間で新しく生まれたり、今議論されてるテーマで注目してるもの • 数と単位への強化 • 書式が変わってしまう問題とStableFormatting • W3Cとの連携強化 / HTML側との協調・Overwrap
• MessageFormatはどうなるのか
数と単位への強化 数値や単位にまつわる提案が多くされ検討されている • 数値・単位・精度をもつオブジェクトとして Amount が提案されてる • データ保持と基本的な変換をサポート & NumberFormatとの連携
• 複合単位(3m50cmみたいなやつ)に関するFormatの検討 • NumberFormatやPluralRulesで末尾ゼロの保持・考慮をする • 内部処理で使われる数値のデータの有効桁数制限引き上げ
書式が変わってしまう問題とStableFormatting 問題点 : 元データのCLDR更新やブラウザ・OSの更新により結果が変化する • → テストや自動処理で困る → 不適切なハックが横行してる 「言語文化に依存しないフォーマット固定ロケール」のようなものが欲しい
• → 紆余曲折(null説/"und"説)がありつつ、"zxx" & Intl.STABLE 定数へ これでテストやデータシリアライズなどでも安定してFormatが使える • 現在Stage2の提案
W3Cとの連携 / HTML側との協調・overwrap 標準化プロセスで「W3C i18nレビュー」を義務化した • 提案をStage 3(または主要ステップ)へ進展させるための要件 HTMLの要素との連携 •
<amount>要素とAmount / <time>要素でのローカライズ MessageFormatで書かれたメッセージの管理 • Message Resources という名前でW3Cで検討を始めている
MessageFormatはどうなるのか JSRuntime側で構文パーサ(DSL)を持つのかが継続的に議論されている • 現在はユーザーのニーズ調査やICU側での実装を待ってる段階 Message ResourcesとDOM Localization • Web標準としてMessageFormatを扱いやすいようにする提案がされている MessageFormatで導入されたSemanticSkeltonという形式
• <time>要素のローカライズで使われる可能性がある
まとめ • Intlの仕様が公開されて14年、いろいろな機能が追加・実装されてきた • ここ3年でも複数のProposalがStage4になったりしている • 特にTemporal周りの仕様策定はここ数年のハイライトかもしれない • 最近は単なる書式化ではなくデータの扱いや他の仕様との連携を議論しがち •
国際化における各要素の扱い方がIntlとしてさらに整備されていきそう • まだまだ新機能・新仕様(=替え玉)が待ちきれない!
宣伝 Intlを含めたweb標準の「今」がわかる連載があるらしい… • 「Web 標準動向」で検索してね!
替え玉も ごちそうさまでした! Ryusei Sajiki / @sajikix