Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Intlのここ数年とこれから
Search
Saji
September 11, 2026
Technology
24
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
400
tpac_study (2026)
sajikix
0
340
業務に残された「良くない型」で考える「TypeScriptの難しさ」
sajikix
4
8.2k
It’s “Time” to use Temporal
sajikix
3
700
ユーザーが作成したコードをブラウザ上で安全に実行できる Plugin システムへのアプローチ
sajikix
1
860
Branded Typesで日時の複雑さと戦う
sajikix
4
1.2k
推しProposalと広がる夢~Intl.MessageFormatとDomLocalization~
sajikix
2
820
自作JSエンジンに推しプロポーザルを実装したい!
sajikix
1
370
Lookback TypeScript ESM support and what should we do now.
sajikix
5
840
Other Decks in Technology
See All in Technology
SQL文一行も書けない人事がCortexもろもろを使って人事業務を楽にしてみる
ponponmikankan
0
120
ペアプロの価値はコードを書くことだけじゃない
codmoninc
PRO
0
130
『止めない』を設計する — 制約の中で、事業の根幹を支える判断
hiroyaterui
0
220
2026-09-11 【Snowflake World Tour Tokyo 2026】Snowflakeを起点に、AI Agentが自律稼働し続ける未来へ / Driving AI Agents with Snowflake
civitaspo
0
170
AIで実装は速くなった。なのにプロダクトは速くならない。職能の壁を越えて価値のフローを設計する
nwiizo
7
7.4k
Multica × 長期記憶:40個のミニプロジェクト管理
eiei114
1
200
現場に行くだけでは足りない——プロダクトエンジニアが業務の流れを捉える観点と、その鍛え方
takumiengineering
0
320
Bet AI Day 2026丨Agentは、「金融」という巨大産業の何を変えられるのか
layerx
PRO
0
1.2k
設計の世代交代を乗り越える、14年続くAndroidアプリの開発戦略
sansantech
PRO
1
150
enechainの内製セルフサービスプラットフォーム
hiyosi
0
130
なぜSRE・セキュリティは評価されないのか?守りの組織を事業成長エンジンに変えた実践
cscengineer
PRO
3
2.3k
生成AI時代の クレデンシャルとパーミッション設計
nrinetcom
PRO
4
1.6k
Featured
See All Featured
Primal Persuasion: How to Engage the Brain for Learning That Lasts
tmiket
0
440
Code Review Best Practice
trishagee
74
20k
How to Get Subject Matter Experts Bought In and Actively Contributing to SEO & PR Initiatives.
livdayseo
0
190
Imperfection Machines: The Place of Print at Facebook
scottboms
270
14k
KATA
mclloyd
PRO
35
15k
We Are The Robots
honzajavorek
0
340
VelocityConf: Rendering Performance Case Studies
addyosmani
331
25k
sira's awesome portfolio website redesign presentation
elsirapls
0
410
Bootstrapping a Software Product
garrettdimon
PRO
306
120k
The Web Performance Landscape in 2024 [PerfNow 2024]
tammyeverts
12
1.3k
Building Adaptive Systems
keathley
44
3.2k
My Coaching Mixtape
mlcsv
0
310
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