HTML-global-api-ja.html

<!DOCTYPE html><html lang="ja"><head><meta charset="utf-8">
<title>HTML Standard — Web application APIs（日本語訳）</title>

<link rel="stylesheet" href="common.css" type="text/css">
<link rel="stylesheet" href="common-whatwg.css" type="text/css">

<style>
.arg-list {
	display: block;
	padding-left: 2em;
	white-space: pre-line;
}
</style>

<script src="common0.js"></script>
<script src="common1.js" async></script>


<script>

Util.ready = function(){
	const source_data = {
		toc_main: 'MAIN',
		generate: expand
	};
	Util.switchWordsInit(source_data);
}

function expand(){
	const class_map = this.class_map;
	const tag_map = this.tag_map;
	const link_map = this.link_map;

	return this.html.replace(
		/%[\w\-~一-鿆あ-ん]+|`(.+?)([$@\^])(\w*)/g,
		create_html
	);

	function create_html(match, key, indicator, klass){

if(!key) {//%
	return `<var>${match.slice(1)}</var>`;
}

let href = '';
let href1 = '';
{
	const n = key.indexOf('＠');
	if(n > 0) {
		href1 = key.slice(n + 1);
		key = key.slice(0, n);
	}
}
let text = key;

switch(klass){
case 'r':
	text = `[${key}]`;
	href = `HTML-references.html#refs${key}`;
	break;
case 'l':
	text = `"<code class="literal">${text}</code>"`;
	break;
case 'm':
case 'hd': // IDL member
	const n = text.indexOf('(');
	if(n > 0){
		key = text.slice(0, n);
		text = key + text.slice(n).replace(/\w+/g, '<var>$&</var>');
	}
	break;
case 'sc': // url scheme
	text += ':';
	break;
case 'sl':
	text = `[[${text}]]`;
	break;
case 'U':
	text = `U+${key}`;
	break;
case 'en':
	return `<span lang="en">${key}</span>`;
	break;
}

let tag = tag_map[klass];
if(tag) {
	let classname = class_map[klass];
	classname = classname ? ` class="${classname}"` : '';
	text = `<${tag}${classname}>${text}</${tag}>`;
}

if(indicator !== '^'){
	href = href1 || link_map[ klass ? `${klass}.${key}` : key ] || href;
	if(!href){
		console.log(match); // check error
		return match;
	}

	switch(indicator){
	case '$':
		text = `<a href="${href}">${text}</a>`;
		break;
	case '@':
		text = `<dfn id="${href.slice(1)}">${text}</dfn>`;
		break;
	}
}

return text;


	}
}

</script>


<script type="text/plain" id="_source_data">


●●options

spec_date:2025-02-21
trans_update:2025-02-23
source_checked:240712
page_state_key:HTML
spec_status:LS
original_url:https://html.spec.whatwg.org/multipage/webappapis.html
	abbr_url:HTMLGAPI
nav_prev:WAPI
nav_next:HTMLdynamic
trans_1st_pub:2016-07-23


●●class_map
e:element
a:attr
et:event-type
sc:scheme
jA:abstract
sl:js-slot
h:header
E:error
U:code-point
cn:cp-name
p:property
v:value

●●tag_map
I:code
E:code
m:code
hd:code
c:code
s:samp
e:code
a:code
sc:code
et:code
p:code
v:code
h:code
jA:span
U:span
cn:span
sl:span
V:var
i:i
em:em

●●original_urls
dynamic-markup-insertion:https://html.spec.whatwg.org/multipage/dynamic-markup-insertion.html
timers:https://html.spec.whatwg.org/multipage/timers-and-user-prompts.html
microtask-queuing:https://html.spec.whatwg.org/multipage/timers-and-user-prompts.html
user-prompts:https://html.spec.whatwg.org/multipage/timers-and-user-prompts.html
system-state-and-capabilities:https://html.spec.whatwg.org/multipage/system-state.html
images-2:https://html.spec.whatwg.org/multipage/imagebitmap-and-animations.html
animation-frames:https://html.spec.whatwg.org/multipage/imagebitmap-and-animations.html

●●original_id_map


dom-window-alert-noargs:dom-alert-noargs
dom-window-alert:dom-alert
dom-window-confirm:dom-confirm
dom-window-print:dom-print
dom-window-prompt:dom-prompt

●●mdn_urls
windoworworkerglobalscope:API/WindowOrWorkerGlobalScope
	timerhandler:API/TimerHandler
framerequestcallback:API/FrameRequestCallback
	animationframeprovider:API/AnimationFrameProvider
imagebitmap:API/ImageBitmap
	colorspaceconversion:API/ColorSpaceConversion
	imagebitmapoptions:API/ImageBitmapOptions
	imagebitmapsource:API/ImageBitmapSource
	imageorientation:API/ImageOrientation
	premultiplyalpha:API/PremultiplyAlpha
	resizequality:API/ResizeQuality


●●link_map
	●IDL
Serializable:~HTMLcloning#serializable
Transferable:~HTMLcloning#transferable

Promise:~WEBIDL#idl-promise
I.Document:~HTMLdom#document
文書:~HTMLdom#the-document-object
I.Function:~WEBIDL#Function
	~WEBIDL#common-Function
I.VoidFunction:~WEBIDL#VoidFunction
I.Window:~WINDOW#window
I.WindowProxy:~HTMLWPROXY#windowproxy
I.WorkerGlobalScope:~WORKERS#workerglobalscope
I.WindowOrWorkerGlobalScope:#windoworworkerglobalscope
I.TimerHandler:#timerhandler
I.DOMException:~WEBIDL#idl-DOMException
I.FrameRequestCallback:#framerequestcallback
I.AnimationFrameProvider:#animationframeprovider
I.DOMHighResTimeStamp:~HRTIME#dom-domhighrestimestamp
I.DedicatedWorkerGlobalScope:~WORKERS#dedicatedworkerglobalscope
I.OffscreenCanvas:~HEcanvas#offscreencanvas
I.StructuredSerializeOptions:~HTMLcomms#structuredserializeoptions
I.TrustedScript:~TRUSTED-TYPES#trustedscript

E.NotSupportedError:~WEBIDL#notsupportederror
E.InvalidCharacterError:~WEBIDL#invalidcharactererror
E.InvalidStateError:~WEBIDL#invalidstateerror
E.SecurityError:~WEBIDL#securityerror
E.DataCloneError:~WEBIDL#datacloneerror
E.RangeError:~TC39#sec-native-error-types-used-in-this-standard-rangeerror


jA.EnsureCSPDoesNotBlockStringCompilation:~CSP3#can-compile-strings
jA.IsDetachedBuffer:~TC39#sec-isdetachedbuffer

et.afterprint:~HTMLindex#event-afterprint
et.beforeprint:~HTMLindex#event-beforeprint

m.~alert0:#dom-window-alert-noargs
m.alert:#dom-window-alert
m.confirm:#dom-window-confirm
m.print:#dom-window-print
m.prompt:#dom-window-prompt

m.cancelAnimationFrame:#animationframeprovider-cancelanimationframe
m.requestAnimationFrame:#dom-animationframeprovider-requestanimationframe

m.atob:#dom-atob
m.btoa:#dom-btoa

m.clearInterval:#dom-clearinterval
m.clearTimeout:#dom-cleartimeout
m.setInterval:#dom-setinterval
m.setTimeout:#dom-settimeout

m.queueMicrotask:#dom-queuemicrotask

m.isSecureContext:#dom-issecurecontext
m.crossOriginIsolated:#dom-crossoriginisolated
m.origin:#dom-origin
m.reportError:~WAPI#dom-reporterror

m.structuredClone:~HTMLcloning#dom-structuredclone

	■ImageBitmap
I.Blob:~FILEAPI#blob
I.CanvasImageSource:~HEcanvas#canvasimagesource
I.ColorSpaceConversion:#colorspaceconversion
I.ImageBitmap:#imagebitmap
I.ImageBitmapOptions:#imagebitmapoptions
I.ImageBitmapSource:#imagebitmapsource
I.ImageData:~HEcanvas#imagedata
I.ImageOrientation:#imageorientation
I.PremultiplyAlpha:#premultiplyalpha
I.ResizeQuality:#resizequality
I.VideoFrame:~WEBCODECS#videoframe-interface

m.NETWORK_EMPTY:~HEmedia#dom-media-network_empty
m.close:#dom-imagebitmap-close
m.colorSpaceConversion:#dom-imagebitmapoptions-colorspaceconversion
m.createImageBitmap:#dom-createimagebitmap
m.data:~HEcanvas#dom-imagedata-data
m.height:#dom-imagebitmap-height
m.imageOrientation:#dom-imagebitmapoptions-imageorientation
m.networkState:~HEmedia#dom-media-networkstate
m.premultiplyAlpha:#dom-imagebitmapoptions-premultiplyalpha
m.resizeWidth:#dom-imagebitmapoptions-resizewidth
m.resizeHeight:#dom-imagebitmapoptions-resizeheight
m.resizeQuality:#dom-imagebitmapoptions-resizequality
m.type:~FILEAPI#dfn-type
m.width:#dom-imagebitmap-width
m.requestIdleCallback:~REQUESTIDLECALLBACK#the-requestidlecallback-method
m.fetch:~FETCH#dom-global-fetch

e.canvas:~HEcanvas#the-canvas-element
e.img:~HEimages#the-img-element
e.video:~HEmedia#the-video-element
e.script:~HEscripting#the-script-element

l.default:#dom-premultiplyalpha-default
l.flipY:#dom-imageorientation-flipy
l.high:#dom-resizequality-high
l.low:#dom-resizequality-low
l.medium:#dom-resizequality-medium
l.pixelated:#dom-resizequality-pixelated
l.premultiply:#dom-premultiplyalpha-premultiply
l.~default0:#dom-colorspaceconversion-default
l.~none0:#dom-colorspaceconversion-none
l.none:#dom-premultiplyalpha-none
l.from-image:#dom-imageorientation-from-image
	不要）l.none:#dom-imagebitmapoptions-imageorientation-none

V.~resize横幅:#_resizewidth
V.~resize縦幅:#_resizeheight

h.Cross-Origin-Opener-Policy:~ORIGIN#cross-origin-opener-policy-2
h.Cross-Origin-Embedder-Policy:~ORIGIN#cross-origin-embedder-policy


	●用語
~animation~frame~callback識別子:#animation-frame-callback-identifier

単純~dialogを示せない:#cannot-show-simple-dialogs
~setTimeout-setIntervalが返した~IDから一意な~keyへの~map:#map-of-settimeout-and-setinterval-ids
作動中な~timer群が成す~map:#map-of-active-timers
手続きを~timeout後に走らす:#run-steps-after-a-timeout

~animation~frame~callback~map:#list-of-animation-frame-callbacks
~target~obj:#concept-animationframeprovider-target-object
~supportされて:#concept-animationframeprovider-supported
所有者~集合:~WORKERS#concept-WorkerGlobalScope-owner-set

文字列を任意選択で切落す:#optionally-truncate-a-simple-dialog-string
doc.読込んだとき印刷するか:#print-when-loaded
文書を印刷する手続き:#printing-steps
各~animation~frame~callbackを走らす:#run-the-animation-frame-callbacks
~timer初期化~手続き:#timer-initialisation-steps
~timerの入子ng~level:#timer-nesting-level
~timer~task~source:#timer-task-source

	●用語（HTML
一意かつ内部的な値:~HTMLcms#unique-internal-value
新たな一意かつ内部的な値:~HTMLcms#new-unique-internal-value

~task~source:~WAPI#task-source
~task:~WAPI#concept-task
大域~taskを~queueする:~WAPI#queue-a-global-task
小task:~WAPI#microtask
小task~queue:~WAPI#microtask-queue
小taskを~queueする:~WAPI#queue-a-microtask
現在~走っている~task:~WAPI#currently-running-task
関連な~realm:~WAPI#concept-relevant-realm
関連な大域~obj:~WAPI#concept-relevant-global
関連な設定群~obj:~WAPI#relevant-settings-object
静止する:~WAPI#pause
古典~scriptを走らす:~WAPI#run-a-classic-script
古典~scriptを作成する:~WAPI#creating-a-classic-script
~module~script:~WAPI#module-script
例外を報告する:~WAPI#report-an-exception
関連な~agent:~WAPI#relevant-agent
~event~loop:~WAPI#event-loop
aG.~event~loop:~WAPI#concept-agent-event-loop

enV.~secureな文脈:~WAPI#secure-context
enV.生成元:~WAPI#concept-settings-object-origin
enV.~top-level生成元:~WAPI#concept-environment-top-level-origin
enV.非同一-生成元~能力は隔離されるか？:~WAPI#concept-settings-object-cross-origin-isolated-capability
enV.~API用~基底~URL:~WAPI#api-base-url

作動中な~script:~WAPI#active-script
既定の~script~fetch~option群:~WAPI#default-script-fetch-options
~script~fetch~option群:~WAPI#script-fetch-options
sC.基底~URL:~WAPI#concept-script-base-url
sC.~fetch~option群:#concept-script-script-fetch-options
sfO.暗号用~nonce:~WAPI#concept-script-fetch-options-nonce
sfO.完全性~metadata:~WAPI#concept-script-fetch-options-integrity
sfO.構文解析器~metadata:~WAPI#concept-script-fetch-options-parser
sfO.資格証~mode:~WAPI#concept-script-fetch-options-credentials
sfO.~referrer施策:~WAPI#concept-script-fetch-options-referrer-policy
sfO.~fetch優先度:~WAPI#concept-script-fetch-options-fetch-priority


子~navigable:~HTMLds#child-navigable
nav.作動中な文書:~HTMLds#nav-document
全部的に作動中:~HTMLds#fully-active

結付けられた文書:~WINDOW#concept-document-window
~window:~WINDOW#the-window-object

作動中な~sandbox法~flag集合:~ORIGIN#active-sandboxing-flag-set
~sandbox化( ~modal )~flag:~ORIGIN#sandboxed-modals-flag
生成元:~ORIGIN#concept-origin
同一-生成元:~ORIGIN#same-origin
同じ生成元~domain:~ORIGIN#same-origin-domain
生成元を直列化する:~ORIGIN#ascii-serialisation-of-an-origin

~unload~counter:~HTMLlifecycle#unload-counter
終了n入子ng~level:~HTMLlifecycle#termination-nesting-level

~media~data:~HEmedia#media-data
~media要素:~HEmedia#media-element

引数は生成元cleanでない:~HEcanvas#the-image-argument-is-not-origin-clean
画像~引数は利用-可能か検査する:~HEcanvas#check-the-usability-of-the-image-argument

物理-形を得する:~HTMLrendering#obtain-a-physical-form

~load後~task用に準備済み:~HTMLparsing#ready-for-post-load-tasks

	●用語（外部
実装定義:~INFRA#implementation-defined

~forgiving-base64復号する:~INFRA#forgiving-base64-decode
~forgiving-base64符号化する:~INFRA#forgiving-base64-encode
同型に符号化する:~INFRA#isomorphic-encode
改行文字を正規化する:~INFRA#normalize-newlines
連結する:~INFRA#string-concatenate
有順序~map:~INFRA#ordered-map
map.~key:~INFRA#map-key
map.値:~INFRA#map-value
map.~key群:~INFRA#map-getting-the-keys
	~NEQ ε:~INFRA#map-exists
	~SET:~INFRA#map-set

並列的:~HTMLINFRA#in-parallel
l.cross-origin-isolated:~HTMLINFRA#cross-origin-isolated-feature

~surrounding~agent:~TC39#surrounding-agent
c.eval():~TC39#sec-eval-x
c.import():~TC39#sec-import-calls
~JS実行~文脈~stack:~TC39#execution-context-stack
~realm:~TC39#sec-code-realms

~callback関数を呼出す:~WEBIDLjs#invoke-a-callback-function
	~callback this 値:~WEBIDLjs#dfn-callback-this-value

現在の高分解能~時刻:~HRTIME#dfn-current-high-resolution-time

~timer~handler用に計時~報を記録する:~LONGAF#record-timing-info-for-timer-handler

信用-済みな型に準拠な文字列を取得する:~TRUSTED-TYPES#get-trusted-type-compliant-string-algorithm

	●ImageBitmap
~bitmap~dataを取得する:#_get-a-bitmap-data-from-image
代表する~bitmap~data:#_get-a-bitmap-data-from-animated-image

~bitmap~data:#concept-imagebitmap-bitmap-data
~source矩形に切抜いて整形する:#cropped-to-the-source-rectangle-with-formatting
全部的に復号-可能:#concept-imagebitmap-good

url.生成元:~URL1#concept-url-origin

~CORS非同一-生成元:~HTMLurl#cors-cross-origin
~CSS~pixel:~CSSVAL#px
透明な黒:~CSSCOLOR#transparent-black

転送-可能:~HTMLcloning#transferable-objects
直列化-可能:~HTMLcloning#serializable-objects
sl.Detached:~HTMLcloning#detached

~SVG-image:~SVGembedded#elementdef-image
現在の再生位置:~HEmedia#current-playback-position
	:~HTMLdep#file-error-read
画像を特定的に~sniffするための規則:~MIMESNIFF#rules-for-sniffing-images-specifically
生来な~size:~CSSIMAGE#natural-size
生来な寸法:~CSSIMAGE#natural-dimensions
生来な縦幅:~CSSIMAGE#natural-height
生来な横幅:~CSSIMAGE#natural-width

video.生来な縦幅:~HEmedia#concept-video-intrinsic-height
video.生来な横幅:~HEmedia#concept-video-intrinsic-width

~media資源:~HEmedia#media-resource
生成元cleanか:~HEcanvas#concept-canvas-origin-clean

~eventを発火する:~DOM4#concept-event-fire

新たな~promise:~WEBIDLjs#a-new-promise
却下される~promise:~WEBIDLjs#a-promise-rejected-with
~promiseを却下する:~WEBIDLjs#reject
~promiseを解決する:~WEBIDLjs#resolve

転送-手続き:~HTMLcloning#transfer-steps
転送-受信-時の手続き:~HTMLcloning#transfer-receiving-steps
直列化~手続き:~HTMLcloning#serialization-steps
逆直列化~手続き:~HTMLcloning#deserialization-steps

~WebDriver-BiDi利用者~promptが閉じられた:~WEBDRIVER-BIDI#webdriver-bidi-user-prompt-closed
~WebDriver-BiDi利用者~promptが開かれた:~WEBDRIVER-BIDI#webdriver-bidi-user-prompt-opened


●●words_table1
WEBDRIVER-BIDI:https://w3c.github.io/webdriver-bidi/

none0:none
none1:none
default0:default
alert0:alert

SVG-image:SVG <code class="element">image</code>


●●words_table

	●データ型／操作／IDL
Record:
内包-:include::~

	~~整数:number
	数:number
	実数:number
	in 〜s:〜数
	挿入-時:insertion
	順序:ordering
	列挙~値:enum value

	●処理一般／環境／task
小task:microtask::小 task:小タスク
入口:entry::~
compile::::コンパイル
	compilation
load:
	~load後:post-load
unload:
surrounding:
停滞-:stall::~
静止-:pause::~
	~queue法:queuing
無視r:disregard:無視することに
	現在~実行-中な:currently-executeing
高分解能:high resolution::~
失効:expiry:~
	切り上げる:clamping
	~call元:caller
保持体:holder::~::ホルダ
宛先:target::~
優先度:priority::~
連結-:concatenate:~
	連結した結果:concatenation of
setTimeout-setInterval:setTimeout／setInterval

	●変数
	%大域~obj:global
	%前回の~ID:previousId
	%~ID:id
	%引数~群:arguments
this:
	%~this引数:thisArg
	%繰返すか:repeat
	%~realm:realm
	%~timeout:timeout
	%起動ng~script:initiating script
	%~task:task
	%~handler:handler
	%設定群~obj:settings object
	%基底~URL:base URL
	%~fetch~option群:fetch options
	%~script~fetch~option群:-
	%~script:script
	%入子ng~level:nesting level
	%開始-時刻:startTime
	%s:s
	%~window:window
	%文書:document
	%文書~群:-
	%D:-
	%値:value
	%直列形:serialized
	%~data保持体:dataHolder
	%宛先~realm:targetRealm
	%promise:p
	%xywh:-
	%~bitmapを得る手続き
	%~bitmap~data:-
	%生成元cleanか:-
	%image:-
	%O:-
	%~bitmap
	%寸法:-
	%画像~data:imageData
	%入力:-
	%~source矩形
	%横幅:-
	%縦幅:-
	%出力~横幅:outputWidth
	%出力~縦幅:outputHeight
	%平面
	%出力:output
	%~target:target
	%~callback:callback
	%~callback~map:callbacks
	%now:%now
	%~callback~handle群:callbackHandles
	%順序付け識別子:orderingIdentifier
	%~milli秒数:~milliseconds:#1
	%完了~手続き:completionSteps
	%一意な~handle:uniqueHandle
	%~timer~key:~timerKey:
	%大域~名:globalName
	%~method名:methodName
sink::::シンク
	%~sink:sink
	%利用者~prompt~handler:userPromptHandler
	%受容されたか:accepted
	%結果:decodedData
	%結果:result

	●btoa
base64:
forgiving-base64:
同型:isomorphic::~
変形-:transform::変換
	範囲~外:out-of-range
英数字:alphanumerics::~
	語呂的には:mnemonic purposess

	●prompt／印刷
PDF:
alert:
	Cancel
	Click
	OK
WebDriver-BiDi:
訊ねる:askする:~
退ける:dismissする:~
	肯定か否定か:positive or negative／
	-:either positively or negatively
	肯定的:positively
kiosk:
切落す:truncateする:切り落とす
省かれ:elideされ:~
黙って:silentに:~
保存-:save:~
	何段階かにわたる手続きを踏む:through the steps of applying for a home loan
	印刷-法／印刷-用:printing
	印刷-後の:post-printing
印刷機:printer::~::プリンタ
復帰-:revert::~
	-:earlier
辞退-:decline:~
改行文字:newline::~
改行:line break:~
多重定義:overload::~
optional:
開かれ:openされ:~
閉じら:closeさ:~
認知-:acknowledge:~

	注釈を加える:annotate
	進める:advance

	●timer/animation
schedule::::スケジュール
	:time
timeout::::タイムアウト
timer::::タイマー
interval:
handle:
milli::::ミリ
	milli秒:millisecond
節電:low-power:~
電力消費:power usage:~
負荷:load::~
	~UIに応じる余裕を与える:yielding back to avoid starving the user interface
	~~時間を得る:hogging
	強制終了:kill
連続的:consecutive::~
	~~延長 pad
繰返な:repeating:繰り返し続ける
	遅く:slow 〜 down
	間断なくback to back
	予め~schedule:preschedule
	前回の:previous

	●queueMicrotask
	配列し直す:rearrange
batch::::バッチ
為さな:makeしな:~

	完了まで走った:run to completion

	■仕様
	避けれる:avoidable
悪影響:downside:~
介在する:intervening:~
素朴:naïve:~
協調-:coordinate:~

	一貫しな:inconsistent
	に先んじる:preempting
	興味を引く:interesting
	と捉えるのが最も良い:best way of thinking
	協調していない:uncoordinated
	兼ね備える:balance
	しておくように:ought
	選ぶ:choice
	あり得る:possible
	なるべく早く:as soon as possible
	見てとれる:can be seen

	〜することなく:doesn't yield 〜
	~~構成しておく:architecture

	利用者にとって:users to experience
	-:get
	-:yielding
	以前に:previously
	もあれば:sometime
	-:somewhere

	●ImageBitmap
	EXIF
	GPU
	Lanczos
	RAM
alpha:
animated::::アニメート化
bitmap::::ビットマップ
切抜いて:cropして::切り抜いて
切抜かれ:cropされ::切り抜かれ
生来:natural::~

disk::::ディスク
local::::ローカル
sniff::::
sprite-sheet:sprite sheet:::スプライトシート
直列形:serialized::~::シリアル形
逆直列化:deserialization::~::逆シリアル化

黒:black:~
再生位置:playback position::~
	占める:occupy する
双三次:bicubic::~
双線形:bilinear::~
最近傍:nearest neighbor::~
	最近傍~algo:nearest neighbor
品質:quality:~
塗れる:paintできる::~
	:transform

平面:plane::~
拡縮-:scale::~
拡縮ng:scaling::拡縮
	拡縮-法:scaling
描く:drawする::~
描かれ:drawされ::~
	:grid
	上下逆さに:vertically
	:horizontal
縦横比:aspect ratio::~
矩形:rectangle::~
乗算済み:premultiplied::~
	乗算済みにするかどうか:premultiplication behavior
	:place
補正:correction::~
解放-:release::~
高速:fast:~
裏返す:flipする:~
滑らか:smooth::~
	滑らかに補間する:-smoothing
	滑らかに:smoothing
破損-:corrupt:~
歪める:distortする:~

	無い:missing
	終えるまで他を阻む:blocking
	区画:cell
	計算量:computationally
	clip
	fatal way
	giving
	increasing
	~point
	事前に切り分けて:precut
	染まって:tainted
	taken
	左上隅:top-left corner
	ε:unset

	一方で:whereas
	指す:pointing at
	高:high
	整数~倍~size:integer-multiple-size
	整数~倍:clean multiple
	画素~化:pixelation
	〜だけ少し:minor
	最も近く:closest


	■仕様（ ImageBitmap
判定:judgement:~
比較的:relativeに:~

	できるようにする:allow
	多く:expensive
	委ねられ:left up to
	目安:guide
	利用時:making use
	efficient
	何もしない:no extra step is required

	●仕様
不自然:unnatural:~
抑える:reduceする:~
濫用-:abuse:~
粒度:granularity:~
	-:avoid
過度:undue:~
給-:supply:~
準拠な:compliantな:準拠する
的確:right:~
能性:potential:~

	易く:easy
	~~考える:Imagine
	主に:primarily
	ちっぽけな:rather silly
	選ばれ:chosen
	選べる:chooseでき
	見込みが高い:likely
	追加し直す:added back
	アリ性:possibility
	ここではじかれる:This accommodates

	●未分類
agent:
	-loaded
起動ng:initiating:起動元
nonce::::ナンス
暗号用:cryptographic::~
CPU:
	Show More
mobile:::携帯
processor::::プロセッサ
生成元clean:origin-clean::~::オリジン-clean
収まる:fitする:~

	order
	consisting
	:indeed
	:lot
	:part
	:past
	:point
	:shorter
	踏んで:walking
	もっともらしい:trustworthy-looking
	中略して:replace the middle of
	巨大:large
	戻-:back
	用の~~便利:utility
	種:type
	近くに:in the vicinity
	handle:handle
	-:provider
	-:passing
	now:now
	左から右へ動く:moving from left to right
	先祖に向けて〜ない:in children only


	●指示語
現在:currently:~
現在は:currently:~

	以降の:subsequent
	:follow
	先ず:first
	次回の:next
	より低:lower
	より高:higher
	低:low
	まとめる:together
	いくつもの:a lot of
	たくさんの:lots of
	直後:immediately after
	~~後続して何回か:multiple subsequent


●●trans_metadata
<p>
~THIS_PAGEは、~WHATWGによる HTML 仕様の
§ Web application APIs 内の次に挙げる各節を日本語に翻訳したものです：
</p>

<ul>
<li><a href="~HTMLLS/webappapis.html#windoworworkerglobalscope-mixin">§ The WindowOrWorkerGlobalScope mixin</a>
<li><a href="~HTMLLS/webappapis.html#atob">§ Base64 utility methods</a>
<li><a href="~HTMLLS/timers-and-user-prompts.html#timers">§ Timers</a>
<li><a href="~HTMLLS/timers-and-user-prompts.html#microtask-queuing">§ Microtask queuing</a>
<li><a href="~HTMLLS/timers-and-user-prompts.html#user-prompts">§ User prompts</a>
<li><a href="~HTMLLS/imagebitmap-and-animations.html#images-2">§ Images</a>
<li><a href="~HTMLLS/imagebitmap-and-animations.html">§ Animation frames</a>
</ul>

<p>
~PUB
</p>

</script>
</head>
<body>

<header>
	<hgroup>
<h1>HTML — Web application API</h1>
	</hgroup>
</header>

<main id="MAIN" hidden>

		<section id="scripting">
<h3 title="Scripting">8.1. ~scripting</h3>

<p class="trans-note">【
この節の和訳は、
`別~page＠~WAPI#scripting$にて。
】</p>
		</section>
		<section id="windoworworkerglobalscope-mixin">
<h3 title="The WindowOrWorkerGlobalScope mixin">8.2. `WindowOrWorkerGlobalScope^I ~mixin</h3>

<p>
`WindowOrWorkerGlobalScope$I ~mixinは、
`Window$I, `WorkerGlobalScope$I
両~obj上に公開されることになる~APIの利用~用にある。
◎
The WindowOrWorkerGlobalScope mixin is for use of APIs that are to be exposed on Window and WorkerGlobalScope objects.
</p>

<p class="note">注記：
他の標準は、
更に拡張するときは，
<code>partial interface mixin `WindowOrWorkerGlobalScope$I { … };</code>
を適切な参照-とともに利用することが奨励される。
◎
Other standards are encouraged to further extend it using partial interface mixin WindowOrWorkerGlobalScope { … }; along with an appropriate reference.
</p>

<pre class="idl">
typedef (DOMString or `Function$I or `TrustedScript$I) `TimerHandler@I;

interface mixin `WindowOrWorkerGlobalScope@I {
  [Replaceable] readonly attribute USVString `origin$m;
  readonly attribute boolean `isSecureContext$m;
  readonly attribute boolean `crossOriginIsolated$m;

  undefined `reportError$m(any %e);

  // base64 utility methods
  DOMString `btoa$m(DOMString %data);
  ByteString `atob$m(DOMString %data);

  // timers
  long `setTimeout$m(
      `TimerHandler$I %handler,
      optional long %timeout = 0,
      any... %arguments
  );
  undefined `clearTimeout$m(optional long %id = 0);
  long `setInterval$m(
      `TimerHandler$I %handler,
      optional long %timeout = 0,
      any... %arguments
  );
  undefined `clearInterval$m(optional long %id = 0);

  // microtask queuing
  undefined `queueMicrotask$m(`VoidFunction$I %callback);

  // ImageBitmap
  `Promise$&lt;`ImageBitmap$I&gt; `createImageBitmap$m(
      `ImageBitmapSource$I %image,
      optional `ImageBitmapOptions$I %options = {}
  );
  `Promise$&lt;`ImageBitmap$I&gt; `createImageBitmap$m(
      `ImageBitmapSource$I %image,
      long %sx, long %sy, long %sw, long %sh,
      optional `ImageBitmapOptions$I %options = {}
  );
  // structured cloning
  any `structuredClone$m(any %value, optional `StructuredSerializeOptions$I %options = {});
};
`Window$I includes `WindowOrWorkerGlobalScope$I;
`WorkerGlobalScope$I includes `WindowOrWorkerGlobalScope$I;
</pre>

<dl class="domintro">
	<dt>self.`isSecureContext$m</dt>
	<dd>
この大域~objは`~secureな文脈$enVを表現するかどうかを返す。
`SECURE-CONTEXTS$r
◎
Returns whether or not this global object represents a secure context. [SECURE-CONTEXTS]
</dd>

	<dt>%origin = self.`origin$m</dt>
	<dd>
この大域~objの`生成元$を文字列に直列化した結果を返す。
◎
Returns the global object's origin, serialized as string.
</dd>
	<dt>%origin = self.`crossOriginIsolated$m</dt>
	<dd>
この大域~obj内で走っている~scriptには、
非同一-生成元~隔離を要求する~APIを利用することは，許容されるかどうかを返す。
これは、［
`Cross-Origin-Opener-Policy$h,
`Cross-Origin-Embedder-Policy$h
］~HTTP応答~header, および
`cross-origin-isolated$l 特能に依存する。
◎
Returns whether scripts running in this global are allowed to use APIs that require cross-origin isolation. This depends on the `Cross-Origin-Opener-Policy` and `Cross-Origin-Embedder-Policy` HTTP response headers and the "cross-origin-isolated" feature.
</dd>
</dl>

<div class="example">
<p>
開発者には、
`location.origin＠~WINDOW#dom-location-origin$c よりも
`self.origin＠#dom-origin$c を利用することが強く奨励される。
前者は環境の~URLの`生成元$urlを返す一方で、
後者は環境の`生成元$enVを返す。
`https://stargate.example/^c にある文書~内で実行している次の~scriptを~~考える：
◎
Developers are strongly encouraged to use self.origin over location.origin. The former returns the origin of the environment, the latter of the URL of the environment. Imagine the following script executing in a document on https://stargate.example/:
</p>

<pre class="lang-js">
var %frame = document.createElement("iframe")
%frame.onload = function() {
  var %frameWin = %frame.contentWindow
  console.log(%frameWin.location.origin) // "null"
  console.log(%frameWin.origin) // "https://stargate.example"
}
document.body.appendChild(%frame)
</pre>

<p>
`self.origin^c は、
`location.origin^c よりも依拠-可能な~security指示子である。
◎
self.origin is a more reliable security indicator.
</p>
</div>

<div class="algo">
`isSecureContext@m
取得子~手続きは
⇒
~RET ~IS［
コレに`関連な設定群~obj$は`~secureな文脈$enVである
］
◎
The isSecureContext getter steps are to return true if this's relevant settings object is a secure context, or false otherwise.
</div>

<div class="algo">
`origin@m
取得子~手続きは
⇒
~RET `生成元を直列化する$( コレに`関連な設定群~obj$の`生成元$enV )
◎
The origin getter steps are to return this's relevant settings object's origin, serialized.
</div>

<div class="algo">
`crossOriginIsolated@m
取得子~手続きは
⇒
~RET コレに`関連な設定群~obj$の`非同一-生成元~能力は隔離されるか？$enV
◎
The crossOriginIsolated getter steps are to return this's relevant settings object's cross-origin isolated capability.
</div>

		</section>
		<section id="atob">
<h3 title="Base64 utility methods">8.3. ~base64用の~~便利~method</h3>

<p>
［
`atob()$m ／ `btoa()$m
］~methodにより、
内容~dataと~base64符号化法との間で相互に変形できるようになる。
◎
The atob() and btoa() methods allow developers to transform content to and from the base64 encoding.
</p>

<p class="note">注記：
これらの~method名は，語呂的には［
"b" は "binary" を表す,
"a" は "ASCII" を表す
］と見なせるが、
主に歴史的な理由から，実施においては［
入力, 出力†
］いずれも ~Unicode文字列である。
◎
In these APIs, for mnemonic purposes, the "b" can be considered to stand for "binary", and the "a" for "ASCII". In practice, though, for primarily historical reasons, both the input and output of these functions are Unicode strings.
</p>

<p class="trans-note">【†
`atob()^m が返す値は `ByteString^I 型に改められたが
（過去には `DOMString^I 型であった）、
いずれにせよ，~JS側においては暗黙的に`文字列に変換される＠~WEBIDLjs#js-ByteString$。
】</p>

<dl class="domintro">
	<dt>%result = self.`btoa(data)$m</dt>
	<dd>
~Unicode文字列の形をとる入力~data
— 範囲 { `0000^U 〜 `00FF^U } 内の文字のみからなり，各~文字が［
範囲 { 0x00 〜 0xFF } 内の同じ値をとる~binary~byte
］を表現する~data —
を~base64表現へ変換した結果を返す。
◎
Takes the input data, in the form of a Unicode string containing only characters in the range U+0000 to U+00FF, each representing a binary byte with values 0x00 to 0xFF respectively, and converts it to its base64 representation, which it returns.
</dd>
	<dd>
入力~文字列~内に範囲~外の文字がある場合、
`InvalidCharacterError$E 例外が投出される。
◎
Throws an "InvalidCharacterError" DOMException exception if the input string contains any out-of-range characters.
</dd>

	<dt>%result = self.`atob(data)$m</dt>
	<dd>
~Unicode文字列の形をとる［
~base64に符号化された~binary~data
］を包含する入力を~Unicode文字列
— 範囲 { `0000^U 〜 `00FF^U } 内の文字のみからなり，各~文字が［
範囲 { 0x00 〜 0xFF } 内の同じ値をとる~binary~byte
］を表現する文字列 —
へ復号した結果を返す。
◎
Takes the input data, in the form of a Unicode string containing base64-encoded binary data, decodes it, and returns a string consisting of characters in the range U+0000 to U+00FF, each representing a binary byte with values 0x00 to 0xFF respectively, corresponding to that binary data.
</dd>
	<dd>
入力~文字列が妥当な~base64~dataでない場合、
`InvalidCharacterError$E 例外が投出される。
◎
Throws an "InvalidCharacterError" DOMException if the input string is not valid base64 data.
</dd>
</dl>

<div class="algo">
<p>
`btoa(data)@m
~method手続きは：
◎
The btoa(data) method must＼
</p>
<ol>
	<li>
~IF［
%data 内に［
符号位置 ~GT `00FF^U
］を満たす文字がある
］
⇒
~THROW `InvalidCharacterError$E
◎
throw an "InvalidCharacterError" DOMException if data contains any character whose code point is greater than U+00FF.＼
</li>
	<li>
~RET `~forgiving-base64符号化する$( `同型に符号化する$( %data ) )
◎
Otherwise, the user agent must convert data to a byte sequence whose nth byte is the eight-bit representation of the nth code point of data, and then must apply forgiving-base64 encode to that byte sequence and return the result.
</li>
</ol>
</div>

<div class="algo">
<p>
`atob(data)@m
~method手続きは：
◎
The atob(data) method steps are:
</p>
<ol>
	<li>
%結果 ~LET `~forgiving-base64復号する$( %data )
◎
Let decodedData be the result of running forgiving-base64 decode on data.
</li>
	<li>
~IF［
%結果 ~EQ `失敗^i
］
⇒
~THROW `InvalidCharacterError$E
◎
If decodedData is failure, then throw an "InvalidCharacterError" DOMException.
</li>
	<li>
~RET %結果
◎
Return decodedData.
</li>
</ol>
</div>

		</section>
		<section id="dynamic-markup-insertion">
<h3 title="Dynamic markup insertion">8.4. 動的~markup挿入</h3>

<p class="trans-note">【
この節の内容の和訳は、
`別~page＠~HTMLdynamic#dynamic-markup-insertion$にて。
】</p>

		</section>
		<section id="dom-parsing-and-serialization">
<h3 title="DOM parsing">8.5. ~DOMの構文解析-法</h3>

<p class="trans-note">【
この節の内容の和訳は、
`別~page＠~HTMLdynamic#dom-parsing-and-serialization$にて。
】</p>

		</section>
		<section id="timers">
<h3 title="Timers">8.6. ~timer</h3>

<p>
［
`setTimeout()$m ／ `setInterval()$m
］~methodにより、
作者は，~timerに基づく~callbackを~scheduleできるようになる。
◎
The setTimeout() and setInterval() methods allow authors to schedule timer-based callbacks.
</p>

<dl class="domintro">
	<dt>%id = self.`setTimeout(handler [, timeout [, ...arguments ] ])$m</dt>
	<dd>
%timeout ~milli秒~後に
%handler を走らす~timeoutを~scheduleする。
%arguments は そのまま %handler に渡される。
◎
Schedules a timeout to run handler after timeout milliseconds. Any arguments are passed straight through to the handler.
</dd>

	<dt>%id = self.`setTimeout(code [, timeout ])$m</dt>
	<dd>
%timeout ~milli秒~後に
%code を~compileして走らす~timeoutを~scheduleする
◎
Schedules a timeout to compile and run code after timeout milliseconds.
</dd>
	<dt>self.`clearTimeout(id)$m</dt>
	<dd>
［
`setTimeout()$m ／ `setInterval()$m
により設定された~timeout
］のうち， %id で識別されるものを取消す。
◎
Cancels the timeout set with setTimeout() or setInterval() identified by id.
</dd>

	<dt>%id = self.`setInterval(handler [, timeout [, ...arguments ] ])$m</dt>
	<dd>
%timeout ~milli秒ごとに
%handler を走らす~timeoutを~scheduleする。
%arguments は そのまま %handler に渡される。
◎
Schedules a timeout to run handler every timeout milliseconds. Any arguments are passed straight through to the handler.
</dd>

	<dt>%id = self.`setInterval(code [, timeout ])$m</dt>
	<dd>
%timeout ~milli秒ごとに
%code を~compileしてを走らす~timeoutを~scheduleする。
◎
Schedules a timeout to compile and run code every timeout milliseconds.
</dd>

	<dt>self.`clearInterval(id)$m</dt>
	<dd>
［
`setTimeout()$m ／ `setInterval()$m
により設定された~timeout
］のうち， %id で識別されるものを取消す。
◎
Cancels the timeout set with setInterval() or setTimeout() identified by id.
</dd>
</dl>

<p class="note">注記：
~timerは、
入子にできる。
ただし，そのような入子な~timerが 5 個を超えて以降は、
~intervalは 4 ~milli秒~以上に強制される。
◎
Timers can be nested; after five such nested timers, however, the interval is forced to be at least four milliseconds.
</p>

<p class="note">注記：
この~APIは、
~timerを正確に~schedule通りに走らすことは保証しない。
~CPU負荷, 他の~task, 等々に因る延期が予期される。
◎
This API does not guarantee that timers will run exactly on schedule. Delays due to CPU load, other tasks, etc, are to be expected.
</p>

<p>
`WindowOrWorkerGlobalScope$I ~mixinを実装する各~objは、
`~setTimeout-setIntervalが返した~IDから一意な~keyへの~map@
を有する
— それは`有順序~map$であり，初期~時は空とする。
この~mapを成す各~entryの：
◎
Objects that implement the WindowOrWorkerGlobalScope mixin have a map of setTimeout and setInterval IDs, which is an ordered map, initially empty.＼
</p>
<ul>
	<li>
`~key$mapは、
正な整数であり，［
`setTimeout()$m ／ `setInterval()$m
］~callに対する返り値に対応する。
◎
Each key in this map is a positive integer, corresponding to the return value of a setTimeout() or setInterval() call.＼
</li>
	<li>
`値$mapは、
`一意かつ内部的な値$であり，
当の~objの`作動中な~timer群が成す~map$内の ある~keyに対応する。
◎
Each value is a unique internal value, corresponding to a key in the object's map of active timers.
</li>
</ul>

<hr>

<div class="algo">
`setTimeout(handler, timeout, ...arguments)@m
~method手続きは
⇒
~RET `~timer初期化~手続き$( ↓ )
⇒＃
コレ,
%handler,
%timeout,
%arguments
◎
The setTimeout(handler, timeout, ...arguments) method steps are to return the result of running the timer initialization steps given this, handler, timeout, arguments, and false.
</div>

<div class="algo">
`setInterval(handler, timeout, ...arguments)@m
~method手続きは
⇒
~RET `~timer初期化~手続き$( ↓ )
⇒＃
コレ,
%handler,
%timeout,
%arguments,
`繰返す^i
◎
The setInterval(handler, timeout, ...arguments) method steps are to return the result of running the timer initialization steps given this, handler, timeout, arguments, and true.
</div>

<div class="algo">
<p>
［
`clearTimeout(id)@m
／
`clearInterval(id)@m
］~method手続きは、いずれも
⇒
コレの`~setTimeout-setIntervalが返した~IDから一意な~keyへの~map$[ %id ] ~SET ε
◎
The clearTimeout(id) and clearInterval(id) method steps are to remove this's map of setTimeout and setInterval IDs[id].
</p>

<p class="note">注記：
両~methodとも，同じ~mapに属する~entryを~clearするので、
どちらも［
`setTimeout()$m ／ `setInterval()$m
］で作成された~timerを~clearするのに利用できる。
◎
Because clearTimeout() and clearInterval() clear entries from the same map, either method can be used to clear timers created by setTimeout() or setInterval().
</p>
</div>

<hr>

<div class="algo">
<p>
`~timer初期化~手続き@
は、
所与の
⇒＃
`WindowOrWorkerGlobalScope$I %大域~obj,
［ 文字列 ／ `Function$I ／ `TrustedScript$I ］ %~handler,
~~整数 %~timeout,
~list %引数~群,
%繰返すか ~IN { `繰返す^i, ε } （省略時は ε ）,
%前回の~ID（省略時は ε ）
◎終
に対し，~~整数を返す：
◎
To perform the timer initialization steps, given a WindowOrWorkerGlobalScope global, a string or Function or TrustedScript handler, a number timeout, a list arguments, a boolean repeat, and optionally (and only if repeat is true) a number previousId, perform the following steps. They return a number.
</p>
<ol>
	<li>
%~this引数 ~LET %大域~obj に応じて
⇒＃
`WorkerGlobalScope$I ~objであるならば %大域~obj ／
`Window$I ~objであるならば %大域~obj に対応する `WindowProxy$I ~obj
◎
Let thisArg be global if that is a WorkerGlobalScope object; otherwise let thisArg be the WindowProxy that corresponds to global.
</li>
	<li>
%一意な~keyへの~map ~LET %大域~obj の`~setTimeout-setIntervalが返した~IDから一意な~keyへの~map$
◎
↓</li>
	<li>
%~ID ~LET %前回の~ID
◎
If previousId was given, let id be previousId;＼
</li>
	<li>
~IF［
%~ID ~EQ ε
］
⇒
%~ID ~SET 次を満たす`実装定義$な整数
⇒
［
正である
］~AND［
%一意な~keyへの~map[ %~ID ] ~EQ ε
］
◎
otherwise, let id be an implementation-defined integer that is greater than zero and does not already exist in global's map of setTimeout and setInterval IDs.
</li>
	<li>
%入子ng~level ~LET 0
◎
↓</li>
	<li>
<p>
~IF［
`~surrounding~agent$の`~event~loop$aGにて`現在~走っている~task$は，
この~algoにより作成された`~task$である
］
⇒
%入子ng~level ~LET その~taskの`~timerの入子ng~level$
◎
If the surrounding agent's event loop's currently running task is a task that was created by this algorithm, then let nesting level be the task's timer nesting level. Otherwise, let nesting level be zero.
</p>

<p class="note">注記：
~taskの`~timerの入子ng~level$は、［
`setTimeout()$m に対する入子な~call，
`setInterval()$m により作成される繰返な~timer
］のどちらにも利用される（この 2 つの組合nも含め）。
言い換えれば、
特定0の~methodではなく，この~algoの入子な呼出nを表現する。
◎
The task's timer nesting level is used both for nested calls to setTimeout(), and for the repeating timers created by setInterval(). (Or, indeed, for any combination of the two.) In other words, it represents nested invocations of this algorithm, not of a particular method.
</p>
	</li>
	<li>
~IF［
%~timeout ~LT 0
］
⇒
%~timeout ~SET 0
◎
If timeout is less than 0, then set timeout to 0.
</li>
	<li>
~IF［
%入子ng~level ~GT 5
］~AND［
%~timeout ~LT 4
］
⇒
%~timeout ~SET 4
◎
If nesting level is greater than 5, and timeout is less than 4, then set timeout to 4.
</li>
	<li>
%~realm ~LET %大域~obj に`関連な~realm$
◎
Let realm be global's relevant realm.
</li>
	<li>
%起動ng~script ~LET `作動中な~script$
◎
Let initiating script be the active script.
</li>
	<li>
%一意な~handle ~LET ~NULL
◎
Let uniqueHandle be null.
</li>
	<li class="algo">
<p>
%~task ~LET 次の手続きを走らす`~task$：
◎
Let task be a task that runs the following substeps:
</p>
		<ol>
			<li>
~Assert：
%一意な~handle は ~NULL でない`一意かつ内部的な値$である。
◎
Assert: uniqueHandle is a unique internal value, not null.
</li>
			<li>
~IF［
%一意な~keyへの~map[ %~ID ] ~EQ ε
］
⇒
~RET
◎
If id does not exist in global's map of setTimeout and setInterval IDs, then abort these steps.
</li>
			<li>
<p>
~IF［
%一意な~keyへの~map[ %~ID ] ~NEQ %一意な~handle
］
⇒
~RET
◎
If global's map of setTimeout and setInterval IDs[id] does not equal uniqueHandle, then abort these steps.
</p>

<p class="note">注記：
%~ID が ある［
`clearTimeout()$m ／ `clearInterval()$m
］~callにより~clearされたが，後続な［
`setTimeout()$m ／ `setInterval()$m
］~call（順不同）により再利用されている場合、
ここではじかれる。
◎
This accommodates for the ID having been cleared by a clearTimeout() or clearInterval() call, and being reused by a subsequent setTimeout() or setInterval() call.
</p>
			</li>
			<li>
`~timer~handler用に計時~報を記録する$( %~handler, %大域~obj に`関連な設定群~obj$, %繰返すか )
◎
Record timing info for timer handler given handler, global's relevant settings object, and repeat.
</li>
			<li>
~IF［
%~handler は `Function$I である
］
⇒
`~callback関数を呼出す$( %~handler, %引数~群, `報告する^i, %~this引数 )
◎
If handler is a Function, then invoke handler given arguments and "report", and with callback this value set to thisArg.
</li>
			<li>
<p>
~ELSE：
◎
Otherwise:
</p>
				<ol>
					<li>
<p>
~IF［
%前回の~ID ~EQ ε
］：
◎
If previousId was not given:
</p>
						<ol>
							<li>
%大域~名 ~LET %大域~obj に応じて
⇒＃
`Window$I ~objであるならば `Window^l ／
~ELSE_ `WorkerGlobalScope^l
◎
Let globalName be "Window" if global is a Window object; "WorkerGlobalScope" otherwise.
</li>
							<li>
%~method名 ~LET %繰返すか に応じて
⇒＃
`繰返す^i ならば `setInterval^l ／
~ELSE_ `setTimeout^l
◎
Let methodName be "setInterval" if repeat is true; "setTimeout" otherwise.
</li>
							<li>
%~sink ~LET « %大域~名, %~method名 » を `0020^U `SPACE^cn で`連結する$
◎
Let sink be a concatenation of globalName, U+0020 SPACE, and methodName.
</li>
							<li>
%~handler ~SET `信用-済みな型に準拠な文字列を取得する$( ↓ )
⇒＃
`TrustedScript$I,
%大域~obj,
%~handler,
%~sink,
`script^l
◎
Set handler to the result of invoking the Get Trusted Type compliant string algorithm with TrustedScript, global, handler, sink, and "script".
</li>
						</ol>
					</li>
					<li>
~Assert：
%~handler は文字列である
◎
Assert: handler is a string.
</li>
					<li>
<p>
次を遂行する
⇒
`EnsureCSPDoesNotBlockStringCompilation$jA( ↓ )
⇒＃
%~realm,
« »,
%~handler,
%~handler,
`~timer^i,
« »,
%~handler
◎
Perform EnsureCSPDoesNotBlockStringCompilation(realm, « », handler, handler, timer, « », handler).＼
</p>

<p>
例外 %e が投出されたときは、
~catchして
⇒＃
`例外を報告する$( %e, %大域~obj )；
~RET
◎
If this throws an exception, catch it, report it for global, and abort these steps.
</p>
					</li>
					<li>
%設定群~obj ~LET %大域~obj に`関連な設定群~obj$
◎
Let settings object be global's relevant settings object.
</li>
					<li>
%~fetch~option群 ~LET `既定の~script~fetch~option群$
◎
Let fetch options be the default script fetch options.
</li>
					<li>
%基底~URL ~LET %設定群~obj の`~API用~基底~URL$enV
◎
Let base URL be settings object's API base URL.
</li>
					<li>
<p>
~IF［
%起動ng~script ~NEQ ~NULL
］：
◎
If initiating script is not null, then:
</p>
						<ol>
							<li>
%~script~fetch~option群 ~LET %起動ng~script の`~fetch~option群$sC
◎
↓</li>
							<li>
%~fetch~option群 ~SET 新たな`~script~fetch~option群$
— その
⇒＃
`暗号用~nonce$sfO ~SET %~script~fetch~option群 の`暗号用~nonce$sfO,
`完全性~metadata$sfO ~SET 空~文字列,
`構文解析器~metadata$sfO ~SET `not-parser-inserted^l,
`資格証~mode$sfO ~SET %~script~fetch~option群 の`資格証~mode$sfO,
`~referrer施策$sfO ~SET %~script~fetch~option群 の`~referrer施策$sfO,
`~fetch優先度$sfO ~SET `auto^l
◎
Set fetch options to a script fetch options whose cryptographic nonce is initiating script's fetch options's cryptographic nonce, integrity metadata is the empty string, parser metadata is "not-parser-inserted", credentials mode is initiating script's fetch options's credentials mode, referrer policy is initiating script's fetch options's referrer policy, and fetch priority is "auto".
</li>
							<li>
%基底~URL ~SET %起動ng~script の`基底~URL$sC
◎
Set base URL to initiating script's base URL.
</li>
						</ol>

<p class="note">
この手続きによる効果は、［
`setTimeout()$m ／ `setInterval()$m
］が文字列を~compileするときの挙動は，
`eval()$c によるそれと等価になることを確保する。
すなわち、
`import()$c 介して~fetchする【される？】`~module~script$は，
両~文脈において同じに挙動することになる。
◎
The effect of these steps ensures that the string compilation done by setTimeout() and setInterval() behaves equivalently to that done by eval(). That is, module script fetches via import() will behave the same in both contexts.
</p>
					</li>
					<li>
%~script ~LET `古典~scriptを作成する$( ↓ )
⇒＃
%~handler,
%設定群~obj,
%基底~URL,
%~fetch~option群
◎
Let script be the result of creating a classic script given handler, settings object, base URL, and fetch options.
</li>
					<li>
`古典~scriptを走らす$( %~script )
◎
Run the classic script script.
</li>
				</ol>
			</li>
			<li>
~IF［
%一意な~keyへの~map[ %~ID ] ~EQ ε
］
⇒
~RET
◎
If id does not exist in global's map of setTimeout and setInterval IDs, then abort these steps.
</li>
			<li>
<p>
~IF［
%一意な~keyへの~map[ %~ID ] ~NEQ %一意な~handle
］
⇒
~RET
◎
If global's map of setTimeout and setInterval IDs[id] does not equal uniqueHandle, then abort these steps.
</p>

<p class="note">注記：
%~ID は、
%~handler 内の作者~codeにより［
`clearTimeout()$m ／ `clearInterval()$m
］を~callして~clearされ，後続な［
`setTimeout()$m ／ `setInterval()$m
］~callにより再利用されているアリ性もある。
この段は、
そのことを検査する。
◎
The ID might have been removed via the author code in handler calling clearTimeout() or clearInterval(). Checking that uniqueHandle isn't different accounts for the possibility of the ID, after having been cleared, being reused by a subsequent setTimeout() or setInterval() call.
</p>
			</li>
			<li>
~IF［
%繰返すか ~EQ `繰返す^i
］
⇒
`~timer初期化~手続き$( ↓ )
⇒＃
%大域~obj,
%~handler,
%~timeout,
%引数~群,
`繰返す^i,
%~ID
◎
If repeat is true, then perform the timer initialization steps again, given global, handler, timeout, arguments, true, and id.
</li>
			<li>
~ELSE
⇒
%一意な~keyへの~map[ %~ID ] ~SET ε
◎
Otherwise, remove global's map of setTimeout and setInterval IDs[id].
</li>
		</ol>
	</li>
	<li>
%入子ng~level ~INCBY 1
◎
Increment nesting level by one.
</li>
	<li>
%~task の`~timerの入子ng~level@
~SET %入子ng~level
◎
Set task's timer nesting level to nesting level.
</li>
	<li>
%完了~手続き ~LET 次を走らす~algo
⇒
`大域~taskを~queueする$(
`~timer~task~source@
,
%大域~obj, %~task )
◎
Let completionStep be an algorithm step which queues a global task on the timer task source given global to run task.
</li>
	<li>
%一意な~handle ~SET `手続きを~timeout後に走らす$( ↓ )
⇒＃
%大域~obj,
`setTimeout/setInterval^l,
%~timeout,
%完了~手続き
◎
Set uniqueHandle to the result of running steps after a timeout given global, "setTimeout/setInterval", timeout, completionStep.
</li>
	<li>
%一意な~keyへの~map[ %~ID ] ~SET %一意な~handle
◎
Set global's map of setTimeout and setInterval IDs[id] to uniqueHandle.
</li>
	<li>
~RET %~ID
◎
Return id.
</li>
</ol>
</div>

<p class="note">注記：
~Web~IDLに定義されるとおり、
引数の変換は，`~timer初期化~手続き$が呼出される前に~Web~IDLにて定義される~algo内で起こる
（例：最初の引数として渡された~objに対し `toString()^m ~methodを呼出すなど）：
◎
Argument conversion as defined by Web IDL (for example, invoking toString() methods on objects passed as the first argument) happens in the algorithms defined in Web IDL, before this algorithm is invoked.
</p>

<div class="example">
<p>
例えば、次のちっぽけな~codeによる結果の %log は
`ONE&nbsp;TWO&nbsp;^l
になる：
◎
So for example, the following rather silly code will result in the log containing "ONE TWO ":
</p>

<pre class="lang-js">
var %log = '';
function logger(%s) { %log += %s + ' '; }

setTimeout({ toString: function () {
  setTimeout("logger('ONE')", 100);
  return "logger('TWO')";
} }, 100);
</pre>
</div>

<div class="example">
<p>
数~milli秒かかる~taskを間断なく遅延なしに走らせつつ，
~browserにも~UIに応じる余裕を与える
（および，~browserが~CPU~~時間を得るために~scriptを強制終了するのを避ける）
ためには、
単純に作業を遂行する前に次回の~timerを~queueする：
◎
To run tasks of several milliseconds back to back without any delay, while still yielding back to the browser to avoid starving the user interface (and to avoid the browser killing the script for hogging the CPU), simply queue the next timer before performing work:
</p>

<pre class="lang-js">
function doExpensiveWork() {
  var %done = false;
  // ...
  /* <span class="comment">
この部分は、
%done を ~T に設定するまでに数~milli秒かかる
◎
this part of the function takes up to five milliseconds set done to true if we're done
</span> */
  // ...

  return %done;
}

function rescheduleWork() {
  var %id = setTimeout(rescheduleWork, 0); /*
      <span class="comment">
次回の反復を予め~scheduleしておく
◎
preschedule next iteration
</span> */
  if (doExpensiveWork())
    clearTimeout(%id); /*
      <span class="comment">
用済みになったら~timeoutを~clearする
◎
clear the timeout if we don't need it
</span> */
}

function scheduleWork() {
  setTimeout(rescheduleWork, 0);
}

scheduleWork(); /*
  <span class="comment">
たくさんの作業を行う~taskを~queueする
◎
queues a task to do lots of work
</span> */
</pre>
</div>

<p>
`WindowOrWorkerGlobalScope$I ~mixinを実装する各~objは、
`作動中な~timer群が成す~map@
を有する
— それは`有順序~map$であり，初期~時は空とする。
この~mapを成す各~entryの：
◎
Objects that implement the WindowOrWorkerGlobalScope mixin have a map of active timers, which is an ordered map, initially empty.＼
</p>
<ul>
	<li>
`~key$mapは、
ある~timerを表現する`一意かつ内部的な値$である。
◎
Each key in this map is a unique internal value that represents a timer,＼
</li>
	<li>
`値$mapは、
`DOMHighResTimeStamp$I であり，
当の~timer用の失効~時刻を表現する。
◎
and each value is a DOMHighResTimeStamp, representing the expiry time for that timer.
</li>
</ul>

<div class="algo">
<p>
`手続きを~timeout後に走らす@
~algoは、
所与の
⇒＃
`WindowOrWorkerGlobalScope$I %大域~obj,
文字列 %順序付け識別子,
実数 %~milli秒数,
手続き %完了~手続き,
◎終
に対し，`一意かつ内部的な値$を返す：
◎
To run steps after a timeout, given a WindowOrWorkerGlobalScope global, a string orderingIdentifier, a number milliseconds, and a set of steps completionSteps, perform the following steps. They return a unique internal value.
</p>
<ol>
	<li>
%~timer~key ~LET `新たな一意かつ内部的な値$
◎
Let timerKey be a new unique internal value.
</li>
	<li>
%開始-時刻 ~LET `現在の高分解能~時刻$( %大域~obj )
◎
Let startTime be the current high resolution time given global.
</li>
	<li>
%大域~obj の`作動中な~timer群が成す~map$[ %~timer~key ] ~SET 
( %開始-時刻 ~PLUS %~milli秒数 )
◎
Set global's map of active timers[timerKey] to startTime plus milliseconds.
</li>

	<li class="algo">
<p>
この段は`並列的$に走らす：
◎
Run the following steps in parallel:
</p>
		<ol>
			<li>
<p>
%大域~obj に応じて：
</p>
				<ul class="switch">
					<li>
`Window$I ~objである場合
⇒
%大域~obj に`結付けられた文書$が`全部的に作動中$になるまで
更に %~milli秒数 ~milli秒~待機する
（連続的でなくともよい 【？】 ）。
</li>
					<li>
`WorkerGlobalScope$I ~objである場合
⇒
~workerを休止せずに %~milli秒数 ~milli秒~待機する
（連続的でなくともよい）。
</li>
				</ul>

◎
If global is a Window object, wait until global's associated Document has been fully active for a further milliseconds milliseconds (not necessarily consecutively).
◎
Otherwise, global is a WorkerGlobalScope object; wait until milliseconds milliseconds have passed with the worker not suspended (not necessarily consecutively).
</li>
			<li>
<p>
［
この~algoのこの呼出n %A より先に呼出された，この~algoの他の呼出n %B
］のうち， ~AND↓ を満たすものがあれば、
それらが完了するまで待機する：
</p>
				<ul>
					<li>
完了していない
</li>
					<li>
%B における %大域~obj ~EQ %A における %大域~obj
</li>
					<li>
%B における %順序付け識別子 ~EQ %A における %順序付け識別子
</li>
					<li>
%B における %~milli秒数 ~LTE %A における %~milli秒数 †
</li>
				</ul>

<p class="trans-note">【†
例えば ( %A, %B ) における %~milli秒数 が ( 1, 2 ) の場合、
%B が %A より 100 ~milli秒~早く呼出されていても，
%A から先に実行される余地があることになる。
】</p>

◎
Wait until any invocations of this algorithm that had the same global and orderingIdentifier, that started before this one, and whose milliseconds is less than or equal to this one's, have completed.
</li>
			<li>
<p>
任意選択で
⇒
`実装定義$な長さの時間だけ待機する
◎
Optionally, wait a further implementation-defined length of time.
</p>

<p class="note">注記：
この段には、［
機器の電力消費を最適化する必要に応じて，~timeoutを~~延長する
］ことを~UAに許容することが意図される。
例えば，~timerの粒度を抑えるような節電~modeを備える処理器も中にはある
— そのような~platformでは、
~UAは，より正確aな非~節電~modeを利用することを要求する代わりに，
この~scheduleに収まるよう~timerを遅くできる。
◎
This is intended to allow user agents to pad timeouts as needed to optimize the power usage of the device. For example, some processors have a low-power mode where the granularity of timers is reduced; on such platforms, user agents can slow timers down to fit this schedule instead of requiring the processor to use the more accurate mode with its associated higher power usage.
</p>
			</li>
			<li>
%完了~手続き を遂行する
◎
Perform completionSteps.
</li>
			<li>
%大域~obj の`作動中な~timer群が成す~map$[ %~timer~key ] ~SET ε
◎
Remove global's map of active timers[timerKey].
</li>
		</ol>
	</li>
</ol>
</div>

<p class="note">
`手続きを~timeout後に走らす$は、
他の仕様が `setTimeout()$m と類似な方式で［
開発者が給した~codeを開発者が給した~timeout後に実行したい
］と求めるとき利用するために意味される
（しかしながら、
それには `setTimeout()$m の［
入子にする／【 %~timeout を】切り上げる
］挙動はないことに注意）。
そのような仕様は、
%順序付け識別子 を選ぶことで，
自身の仕様の~timeoutたちの順序付けを［
他の仕様の~timeoutとの順序付けを拘束しない
］よう確保できる。
◎
Run steps after a timeout is meant to be used by other specifications that want to execute developer-supplied code after a developer-supplied timeout, in a similar manner to setTimeout(). (Note, however, it does not have the nesting and clamping behavior of setTimeout().) Such specifications can choose an orderingIdentifier to ensure ordering within their specification's timeouts, while not constraining ordering with respect to other specification's timeouts.
</p>

		</section>
		<section id="microtask-queuing">
<h3 title="Microtask queuing">8.7. 小taskの~queue法</h3>

<dl class="domintro">
	<dt>%self.`queueMicrotask(callback)$m</dt>
	<dd>
所与の %callback を走らす`小taskを~queueする$。
◎
Queues a microtask to run the given callback.
</dd>
</dl>

<div class="algo">
<p>
`queueMicrotask(callback)@m
~method手続きは
⇒
`小taskを~queueする$( 次の手続き )
◎
The queueMicrotask(callback) method must queue a microtask to＼
</p>

<div class="algo">
手続きは
⇒
`~callback関数を呼出す$( %callback, « », `報告する^i )
◎
invoke callback with « » and "report".
</div>

<p class="note">注記：
%~callback はコレとは別の`~realm$から来ることもあり、
その場合，この大域~objとコレは同じにならない。
◎
This global object not necessarily the same as this, if callback comes from another realm.
</p>
</div>

<p>
`queueMicrotask()$m ~methodは、
作者の~callbackを`小task~queue$上に~scheduleすることを許容する。
これは、当の~callbackの~codeを
— 例えば `setTimeout(f, 0)$m を利用したときのように、
`~event~loop$に制御を戻すことなく —
`~JS実行~文脈~stack$が次回に空になったとき，走らすことを許容する
— それが起こるのは、
現在~実行-中な同期的な~JSすべてが完了まで走ったときである。
◎
The queueMicrotask() method allows authors to schedule a callback on the microtask queue. This allows their code to run once the JavaScript execution context stack is next empty, which happens once all currently executing synchronous JavaScript has run to completion. This doesn't yield control back to the event loop, as would be the case when using, for example, setTimeout(f, 0).
</p>

<p>
作者は、［
いくつもの小taskを~scheduleすることは、
いくつもの同期的~codeを走らすことと同じ悪影響を処理能に及ぼす
］ことを自覚すること。
どちらも，~browserが描画などの自前の作業を行うことを~~妨げる。
多くの事例では、［
`requestAnimationFrame()$m ／ `requestIdleCallback()$m
］を選ぶ方が良い。
特に，次回の描画~周回より前に~codeを走らすのが目標なら、
`requestAnimationFrame()$m がその目的を果たす。
◎
Authors ought to be aware that scheduling a lot of microtasks has the same performance downsides as running a lot of synchronous code. Both will prevent the browser from doing its own work, such as rendering. In many cases, requestAnimationFrame() or requestIdleCallback() is a better choice. In particular, if the goal is to run code before the next rendering cycle, that is the purpose of requestAnimationFrame().
</p>

<p>
`queueMicrotask()$m は、
次の例から見てとれるように，同期的な~codeを配列し直す仕組みと捉えるのが最も良い
— 実質的に、~queueした~codeを［
現在~実行-中な同期的な~JSが完了まで走った直後
］に配置するような。
◎
As can be seen from the following examples, the best way of thinking about queueMicrotask() is as a mechanism for rearranging synchronous code, effectively placing the queued code immediately after the currently executing synchronous JavaScript has run to completion.
</p>

<div class="example">
<p>
`queueMicrotask()$m を利用する最も共通的な理由として、［
情報が同期的に可用になる事例でも，過度な遅延が導入される
］ことはないよう，順序を一貫させることが挙げられる。
◎
The most common reason for using queueMicrotask() is to create consistent ordering, even in the cases where information is available synchronously, without introducing undue delay.
</p>

<p>
例えば、
ある~custom要素を考える
— それは、
`load^et ~eventを発火することに加え，以前に読込んだ~dataも内部~cacheに保守する。
素朴に実装するなら、
次の様になろう：
◎
For example, consider a custom element firing a load event, that also maintains an internal cache of previously-loaded data. A naïve implementation might look like:
</p>

<pre class="lang-js">
MyElement.prototype.loadData = function (%url) {
  if (this._cache[%url]) {
    this._setData(this._cache[%url]);
    this.dispatchEvent(new Event("load"));
  } else {
    fetch(%url).then(%res =&gt; %res.arrayBuffer()).then(%data =&gt; {
      this._cache[%url] = %data;
      this._setData(%data);
      this.dispatchEvent(new Event("load"));
    });
  }
};</pre>

<p>
しかしながら，この実装には、
利用者にとって挙動が一貫しなくなり得る問題がある。
例えば、次のような~codeでは：
◎
This naïve implementation is problematic, however, in that it causes its users to experience inconsistent behavior. For example, code such as
</p>

<pre class="lang-js">
%element.addEventListener("load", () =&gt; console.log("loaded"));
console.log("1");
%element.loadData();
console.log("2");
</pre>

<p>
`1^l, `2^l, `loaded^l
の順に~logすることもあれば
（~dataを~fetchする必要がある場合）、
`1^l, `loaded^l, `2^l
の順に~logすることもある
（~dataは すでに~cacheされていた場合）。
同様に、［
`loadData()^c を~callした直後の時点で，要素に~dataが設定されるかどうか
］も一貫しなくなる。
◎
will sometimes log "1, 2, loaded" (if the data needs to be fetched), and sometimes log "1, loaded, 2" (if the data is already cached). Similarly, after the call to loadData(), it will be inconsistent whether or not the data is set on the element.
</p>

<p>
`queueMicrotask()$m を利用すれば、
順序は一貫するようになる：
◎
To get a consistent ordering, queueMicrotask() can be used:
</p>

<pre class="lang-js">
MyElement.prototype.loadData = function (%url) {
  if (this._cache[%url]) {<strong>
    queueMicrotask(() =&gt; {
      this._setData(this._cache[%url]);
      this.dispatchEvent(new Event("load"));
    });</strong>
  } else {
    fetch(%url).then(%res =&gt; %res.arrayBuffer()).then(%data =&gt; {
      this._cache[%url] = %data;
      this._setData(%data);
      this.dispatchEvent(new Event("load"));
    });
  }
};
</pre>

<p>
これは、本質的に，~queueされた~codeを［
`~JS実行~文脈~stack$が空になった後に走らす
］よう配列し直して、
要素の状態の［
順序付け, 更新
］が一貫することを確保する。
◎
By essentially rearranging the queued code to be after the JavaScript execution context stack empties, this ensures a consistent ordering and update of the element's state.
</p>
</div>

<div class="example">
<p>
`queueMicrotask()$m には、
興味を引く別の利用もある
— それは、
協調していない複数の~call元からの作業を “~batch” できるようにする。
例えば、［
なるべく早く~dataを送信したいが、
容易に避けれるなら，複数の~network要請は為さない
］ことが求まれる，ある~library関数を考える。
これらを兼ね備えるには、
次の様な仕方がある：
◎
Another interesting use of queueMicrotask() is to allow uncoordinated "batching" of work by multiple callers. For example, consider a library function that wants to send data somewhere as soon as possible, but doesn't want to make multiple network requests if doing so is easily avoidable. One way to balance this would be like so:
</p>

<pre class="lang-js">
const %queuedToSend = [];

function sendData(%data) {
  %queuedToSend.push(%data);

  if (%queuedToSend.length === 1) {
    queueMicrotask(() =&gt; {
      const %stringToSend = JSON.stringify(%queuedToSend);
      %queuedToSend.length = 0;

      fetch("/endpoint", %stringToSend);
    });
  }
}
</pre>

<p>
このように~~構成しておけば、
`sendData()^c を現在~実行-中な同期的な~JSの中で~~後続して何回か~callしても，
1 回の `fetch()$m ~callにまとめるよう~batchされる
— ~fetchに先んじて介在する~event~loop~taskを経ずに
（代わりに `setTimeout()$m を利用した類似な~codeでは、
そのような~taskが起こることになる）。
◎
With this architecture, multiple subsequent calls to sendData() within the currently executing synchronous JavaScript will be batched together into one fetch() call, but with no intervening event loop tasks preempting the fetch (as would have happened with similar code that instead used setTimeout()).
</p>
</div>

		</section>
		<section id="user-prompts">
<h3 title="User prompts">8.8. 利用者~向けの~prompt</h3>

			<section id="simple-dialogs">
<h4 title="Simple dialogs">8.8.1. 単純な~dialog</h4>

  <dl class="domintro">
	<dt>%window.`alert(message)$m</dt>
	<dd>
所与の~messageを伴う~modal~alertを表示して、
利用者がそれを退けるまで待機する。
◎
Displays a modal alert with the given message, and waits for the user to dismiss it.
</dd>

	<dt>%result = %window.`confirm(message)$m</dt>
	<dd>
所与の~messageを伴う［
OK ／ Cancel
］~modal~promptを表示して、
利用者がそれを退けるまで待機する。
利用者が［
OK を~clickしたなら ~T ／
Cancel を~clickしたなら ~F
］を返す。
◎
Displays a modal OK/Cancel prompt with the given message, waits for the user to dismiss it, and returns true if the user clicks OK and false if the user clicks Cancel.
</dd>

	<dt>%result = %window.`prompt(message [, default])$m</dt>
	<dd>
~text~control, および所与の~messageを伴う~modal~promptを表示して、
利用者がそれを退けるまで待機する。
利用者が［
~promptを取消したなら ~NULL ／
~ELSE_ 利用者が手入力した値
］を返す。
%default 引数が在る場合、
その値が既定の~~入力として利用される。
◎
Displays a modal text control prompt with the given message, waits for the user to dismiss it, and returns the value that the user entered. If the user cancels the prompt, then returns null instead. If the second argument is present, then the given value is used as a default.
</dd>
</dl>

<p class="note">注記：
これらの~methodが呼出された場合、
`~media~data$を読込んでいる`~media要素$などの［
`~task$／`小task$
］に依存する~logicは停滞する。
◎
Logic that depends on tasks or microtasks, such as media elements loading their media data, are stalled when these methods are invoked.
</p>

<div class="algo">
<p>
`~alert0()@m ／
`alert(message)@m
~method手続きは：
◎
The alert() and alert(message) method steps are:
</p>
<ol>
	<li>
~IF［
コレは`単純~dialogを示せない$
］
⇒
~RET
◎
If we cannot show simple dialogs for this, then return.
</li>
	<li>
%message ~LET ［
この~methodは引数を伴わずに呼出されたならば空~文字列 ／
~ELSE_ ~methodの最初の引数
］
◎
If the method was invoked with no arguments, then let message be the empty string; otherwise, let message be the method's first argument.
</li>
	<li>
%message ~SET `文字列を任意選択で切落す$( `改行文字を正規化する$( %message ) )
◎
Set message to the result of normalizing newlines given message.
◎
Set message to the result of optionally truncating message.
</li>
	<li>
%利用者~prompt~handler ~LET `~WebDriver-BiDi利用者~promptが開かれた$( コレ, `alert^l, %message )
◎
Let userPromptHandler be WebDriver BiDi user prompt opened with this, "alert", and message.
</li>
	<li>
<p>
~IF［
%利用者~prompt~handler ~EQ `none^l
］：
◎
If userPromptHandler is "none", then:
</p>
		<ol>
			<li>
`000A^U `LF^cn を改行として扱う下で，利用者に %message を示す
◎
Show message to the user, treating U+000A LF as a line break.
</li>
			<li>
任意選択で
⇒
利用者が~messageを認知するまで`静止する$
◎
Optionally, pause while waiting for the user to acknowledge the message.
</li>
		</ol>
	</li>
	<li>
`~WebDriver-BiDi利用者~promptが閉じられた$( コレ, `alert^l, ~T )
◎
Invoke WebDriver BiDi user prompt closed with this, "alert", and true.
</li>
</ol>

<p class="note">注記：
歴史的な理由から、
この~methodは，
2 個の多重定義を利用して定義されており，~optional引数は利用していない。
これによる実用的な影響iは、
`alert(undefined)^c は `alert("undefined")^c として扱われる一方で，
`alert()^c は `alert("")^c として扱われることである。
◎
This method is defined using two overloads, instead of using an optional argument, for historical reasons. The practical impact of this is that alert(undefined) is treated as alert("undefined"), but alert() is treated as alert("").
</p>
</div>

<div class="algo">
<p>
`confirm(message)@m
~method手続きは：
◎
The confirm(message) method steps are:
</p>
<ol>
	<li>
~IF［
コレは`単純~dialogを示せない$
］
⇒
~RET ~F
◎
If we cannot show simple dialogs for this, then return false.
</li>
	<li>
%message ~SET `文字列を任意選択で切落す$( `改行文字を正規化する$( %message ) )
◎
Set message to the result of normalizing newlines given message.
◎
Set message to the result of optionally truncating message.
</li>
	<li>
`000A^U `LF^cn を改行として扱う下で，利用者に %message を示して、
利用者に肯定か否定か訊ねる
◎
Show message to the user, treating U+000A LF as a line break, and ask the user to respond with a positive or negative response.
</li>
	<li>
`~WebDriver-BiDi利用者~promptが開かれた$( コレ, `confirm^l, %message )
◎
Invoke WebDriver BiDi user prompt opened with this, "confirm", and message.
</li>
	<li>
%利用者~prompt~handler ~LET `~WebDriver-BiDi利用者~promptが開かれた$( コレ, `confirm^l, %message )
◎
Let userPromptHandler be WebDriver BiDi user prompt opened with this, "confirm", and message.
</li>
	<li>
%受容されたか ~LET ~F
◎
Let accepted be false.
</li>
	<li>
<p>
~IF［
%利用者~prompt~handler ~EQ `none^l
］：
◎
If userPromptHandler is "none", then:
</p>
		<ol>
			<li>
利用者が応答するまで`静止する$
◎
Pause until the user responds either positively or negatively.
</li>
			<li>
~IF［
利用者は肯定的に応答した
］
⇒
%受容されたか ~SET ~T
◎
If the user responded positively, then set accepted to true.
</li>
		</ol>
	</li>
	<li>
~IF［
%利用者~prompt~handler ~EQ `accept^l
］
⇒
%受容されたか ~SET ~T
◎
If userPromptHandler is "accept", then set accepted to true.
</li>
	<li>
`~WebDriver-BiDi利用者~promptが閉じられた$( コレ, `confirm^l, %受容されたか )
◎
Invoke WebDriver BiDi user prompt closed with this, "confirm", and accepted.
</li>
	<li>
~RET %受容されたか
◎
Return accepted.
</li>
</ol>
</div>

<div class="algo">
<p>
`prompt(message, default)@m
~method手続きは：
◎
The prompt(message, default) method steps are:
</p>
<ol>
	<li>
~IF［
コレは`単純~dialogを示せない$
］
⇒
~RET ~NULL
◎
If we cannot show simple dialogs for this, then return null.
</li>
	<li>
%message ~SET `文字列を任意選択で切落す$( `改行文字を正規化する$( %message ) )
◎
Set message to the result of normalizing newlines given message.
◎
Set message to the result of optionally truncating message.
</li>
	<li>
%default ~SET `文字列を任意選択で切落す$( %default )
◎
Set default to the result of optionally truncating default.
</li>
	<li>
`000A^U `LF^cn を改行として扱う下で，利用者に %message を示して、
 %default を既定の応答とする下で，利用者に文字列~値で応答するか中止するか訊ねる
◎
Show message to the user, treating U+000A LF as a line break, and ask the user to either respond with a string value or abort. The response must be defaulted to the value given by default.
</li>
	<li>
`~WebDriver-BiDi利用者~promptが開かれた$( コレ, `prompt^l, %message, %default )
◎
Invoke WebDriver BiDi user prompt opened with this, "prompt", message, and default.
</li>
	<li>
%利用者~prompt~handler ~LET `~WebDriver-BiDi利用者~promptが開かれた$( コレ, `prompt^l, %message )
◎
Let userPromptHandler be WebDriver BiDi user prompt opened with this, "prompt", and message.
</li>
	<li>
%結果 ~LET ~NULL
◎
Let result be null.
</li>
	<li>
<p>
~IF［
%利用者~prompt~handler ~EQ `none^l
］：
◎
If userPromptHandler is "none", then:
</p>
		<ol>
			<li>
利用者が応答するまで`静止する$
◎
Pause while waiting for the user's response.
</li>
			<li>
~IF［
利用者は中止しなかった
］
⇒
%結果 ~SET 利用者が応答した文字列
◎
If the user did not abort, then set result to the string that the user responded with.
</li>
		</ol>
	</li>
	<li>
~ELIF［
%利用者~prompt~handler ~EQ `accept^l
］
⇒
%結果 ~SET 空~文字列
◎
Otherwise, if userPromptHandler is "accept", then set result to the empty string.
</li>
	<li>
`~WebDriver-BiDi利用者~promptが閉じられた$( コレ, `prompt^l, ~IS［ %結果 ~NEQ ~NULL ］, %結果 )
◎
Invoke WebDriver BiDi user prompt closed with this, "prompt", false if result is null or true otherwise, and result.
</li>
	<li>
~RET %結果
◎
Return result.
</li>
</ol>
</div>

<div class="algo">
<p>
`文字列を任意選択で切落す@
~algoは、
所与の
( 文字列 %s )
に対し
⇒
~RET %s または %s から導出されるより短い何らかの文字列
◎
To optionally truncate a simple dialog string s, return either s itself or some string derived from s that is shorter.＼
</p>

<p>
~UAは、
%s から省かれた部位を表示するための~UIを供するべきでない
— そうすると
“~securityに関する重要事項です。次を~clickして全部的な詳細を読んで下さい。”
のような類の~dialogを容易に作成できてしまい，濫用され易くなるので。
◎
User agents should not provide UI for displaying the elided portion of s, as this makes it too easy for abusers to create dialogs of the form "Important security alert! Click 'Show More' for full details!".
</p>

<p class="note">注記：
例えば~UAは、
~messageを成す最初の 100 文字だけ表示したり，
文字列を "…" で中略するよう求めるかもしれない。
この種の改変は、
不自然に巨大な, もっともらしい~system~dialogに濫用される能性を制限するために有用になり得る。
◎
For example, a user agent might want to only display the first 100 characters of a message. Or, a user agent might replace the middle of the string with "…". These types of modifications can be useful in limiting the abuse potential of unnaturally large, trustworthy-looking system dialogs.
</p>
</div>

<div class="algo">
<p>
所与の`~window$ %~window が
`単純~dialogを示せない@
とは、
次の~algoが ~T を返すことをいう：
◎
We cannot show simple dialogs for a Window window when the following algorithm returns true:
</p>
<ol>
	<li>
~IF［
`~sandbox化( ~modal )~flag$ ~IN ［
%~window に`結付けられた文書$にて`作動中な~sandbox法~flag集合$
］］
⇒
~RET ~T
◎
If the active sandboxing flag set of window's associated Document has the sandboxed modals flag set, then return true.
</li>
	<li>
~IF［
( %~window に`関連な設定群~obj$の`生成元$enV,
%~window に`関連な設定群~obj$の`~top-level生成元$enV )
は`同じ生成元~domain$でない
］
⇒
~RET ~T
◎
If window's relevant settings object's origin and window's relevant settings object's top-level origin are not same origin-domain, then return true.
</li>
	<li>
任意選択で
⇒
~IF［
%~window に`関連な~agent$の`~event~loop$aGの`終了n入子ng~level$ ~NEQ 0
］
⇒
~RET ~T
◎
If window's relevant agent's event loop's termination nesting level is nonzero, then optionally return true.
</li>
	<li>
<p>
任意選択で
⇒
~RET ~T
</p>
<p>
（例えば，~UAは、
利用者に［
以降の~modal~dialogをすべて無視する~option
］を与えることもできる
— 利用者がその~optionを選んだ場合、
この手続きを呼出した~methodは，それ以降 呼出される度に，この段で中止されることになる。）
</p>
◎
Optionally, return true. (For example, the user agent might give the user the option to ignore all modal dialogs, and would thus abort at this step whenever the method was invoked.)
</li>
	<li>
~RET ~F
◎
Return false.
</li>
</ol>
</div>

			</section>
			<section id="printing">
<h4 title="Printing">8.8.2. 印刷-法</h4>

<dl class="domintro">
	<dt>%window.`print()$m</dt>
	<dd>
利用者に~pageを印刷する旨を~promptする。
◎
Prompts the user to print the page.
</dd>
</dl>

<div class="algo">
<p>
`print()@m
~method手続きは：
◎
The print() method steps are:
</p>
<ol>
	<li>
%文書 ~LET コレに`結付けられた文書$
◎
Let document be this's associated Document.
</li>
	<li>
~IF［
%文書 は`全部的に作動中$でない
］
⇒
~RET
◎
If document is not fully active, then return.
</li>
	<li>
~IF［
%文書 の`~unload~counter$ ~GT 0
］
⇒
~RET
◎
If document's unload counter is greater than 0, then return.
</li>
	<li>
~IF［
%文書 は`~load後~task用に準備済み$である
］
⇒
`文書を印刷する手続き$( %文書 )
◎
If document is ready for post-load tasks, then run the printing steps for document.
</li>
	<li>
~ELSE
⇒
%文書 の
`読込んだとき印刷するか@doc
~SET ~T
【この~flagは、初期~時には暗黙的に ~F をとる】
◎
Otherwise, set document's print when loaded flag.
</li>
</ol>
</div>

<p>
~UAは、
利用者から文書の`物理-形を得する$
（例：印刷, あるいは ~PDF など，物理-形による表現も含む）
機会を依頼されたときも、
`文書を印刷する手続き$を走らすべきである。
◎
User agents should also run the printing steps whenever the user asks for the opportunity to obtain a physical form (e.g. printed copy), or the representation of a physical form (e.g. PDF copy), of a document.
</p>

<div class="algo">
<p>
`文書を印刷する手続き@
は、
所与の
( `文書$ %文書 )
に対し：
◎
The printing steps for a Document document are:
</p>
<ol>
	<li>
<p>
任意選択で
⇒
利用者に~messageを表示する
◎
The user agent may display a message to the user＼
↓ or return (or both).
◎
↓ For instance, a kiosk browser could silently ignore any invocations of the print() method.
</p>

<p class="example">
一例として，~mobile機器~上の~browserは、
近くに印刷機が無いことを検出したなら，
“~PDFに保存する” ~optionを提供するに先立って その旨を伝える~messageを表示することもできる。
◎
For instance, a browser on a mobile device could detect that there are no printers in the vicinity and display a message saying so before continuing to offer a "save to PDF" option.
</p>
	</li>
	<li>
<p>
任意選択で
⇒
~RET
</p>

<p class="example">
一例として，~kiosk~browserは、
`print()$m ~methodに対する呼出n すべてを黙って無視することもできる。
</p>
◎
↑</li>
	<li>
<p>
~IF［
`~sandbox化( ~modal )~flag$ ~IN
%文書 にて`作動中な~sandbox法~flag集合$
］
⇒
~RET
◎
If the active sandboxing flag set of document has the sandboxed modals flag set, then return.
</p>

<p class="note">注記：
印刷-用~dialogが %文書 の~sandboxで阻止された場合、
`beforeprint$et ／ `afterprint$et
~eventは発火されない。
◎
If the printing dialog is blocked by a Document's sandbox, then neither the beforeprint nor afterprint events will be fired.
</p>
	</li>
	<li>
%文書~群 ~LET  %文書, および［
%文書 内の各 `子~navigable$【にて`作動中な文書$nav】
］たちが成す集合
【順序は定義されていない。】
◎
↓</li>
	<li>
<p>
%文書~群 を成す
~EACH( %D )
に対し
⇒
`~eventを発火する$( %D に`関連な大域~obj$, `beforeprint$et )
◎
The user agent must fire an event named beforeprint at the relevant global object of document, as well as any child navigable in it.
</p>

<p class="XXX">
ここで子~以外の子孫に向けて発火しないことは、
的確とは見受けられない
— 何らかの~taskを~queueする必要がある見込みが高い。
`課題 #5096＠~HTMLissue/5096$ を見よ。
◎
Firing in children only doesn't seem right here, and some tasks likely need to be queued. See issue #5096.
</p>

<p class="example">
`beforeprint$et ~eventは、
印刷される複製に注釈を加えるときに利用できる
— 一例として，印刷した時刻を追加するなど。
◎
The beforeprint event can be used to annotate the printed copy, for instance adding the time at which the document was printed.
</p>

	</li>
	<li>
<p>
~UAは、
利用者に %文書 の`物理-形を得する$（または その表現を得る）機会を提供するべきである
— そうする場合
⇒
利用者が受容するか辞退するまで待機してもヨイ
— そうする場合
⇒
待機-中は`静止する$モノトスル。
◎
The user agent should offer the user the opportunity to obtain a physical form (or the representation of a physical form) of document. The user agent may wait for the user to either accept or decline before returning; if so, the user agent must pause while the method is waiting.＼
</p>

<p>
待機するかどうかにかかわらず、
当の物理-形には，この~algoのこの時点における %文書 の状態を利用するモノトスル。
◎
Even if the user agent doesn't wait at this point, the user agent must use the state of the relevant documents as they are at this point in the algorithm if and when it eventually creates the alternate form.
</p>
	</li>
	<li>
<p>
%文書~群 を成す
~EACH( %D )
に対し
⇒
`~eventを発火する$( %D に`関連な大域~obj$, `afterprint$et )
◎
The user agent must fire an event named afterprint at the relevant global object of document, as well as any child navigables in it.
</p>

<p class="XXX">
ここで子~以外の子孫に向けて発火しないことは、
的確とは見受けられない
— 何らかの~taskを~queueする必要がある見込みが高い。
`課題 #5096＠~HTMLissue/5096$ を見よ。
◎
Firing in children only doesn't seem right here, and some tasks likely need to be queued. See issue #5096.
</p>

<p class="example">
`afterprint$et ~eventは、
`beforeprint$et ~event時に追加された注釈を復帰するため,
あるいは印刷-後の~UIを示すためにも利用できる。
後者の一例としては、
利用者に何段階かにわたる手続きを踏んでもらう~pageがあるとき、
~scriptは，印刷-後に自動的に次の段階へ進めることもできる。
◎
The afterprint event can be used to revert annotations added in the earlier event, as well as showing post-printing UI. For instance, if a page is walking the user through the steps of applying for a home loan, the script could automatically advance to the next step after having printed a form or other.
</p>
	</li>
</ol>
</div>

			</section>
		</section>
		<section id="system-state-and-capabilities">
<h3 title="System state and capabilities">8.9. ~systemの状態と能力</h3>

<p class="trans-note">【
この節の内容の和訳は、
`別~page＠~HTMLnavigator$にて。
】</p>

		</section>
		<section id="images-2">
<h3 title="Images">8.10. 画像</h3>

<pre class="idl">
[Exposed=(Window,Worker), `Serializable$, `Transferable$]
interface `ImageBitmap@I {
  readonly attribute unsigned long `width$m;
  readonly attribute unsigned long `height$m;
  undefined `close$m();
};

typedef (`CanvasImageSource$I or
         `Blob$I or
         `ImageData$I) `ImageBitmapSource@I;

enum `ImageOrientation@I { `from-image$l, `flipY$l };
enum `PremultiplyAlpha@I { `none$l, `premultiply$l, `default$l };
enum `ColorSpaceConversion@I { `~none0$l, `~default0$l };
enum `ResizeQuality@I { `pixelated$l, `low$l, `medium$l, `high$l };

dictionary `ImageBitmapOptions@I {
  `ImageOrientation$I `imageOrientation$m = `from-image$l;
  `PremultiplyAlpha$I `premultiplyAlpha$m = `default$l;
  `ColorSpaceConversion$I `colorSpaceConversion$m = `~default0$l;
  [EnforceRange] unsigned long `resizeWidth$m;
  [EnforceRange] unsigned long `resizeHeight$m;
  `ResizeQuality$I `resizeQuality$m = `low$l;
};
</pre>

 
<p>
`ImageBitmap$I ~objは、
過度な待時間なく~canvasに塗れるような，~bitmap画像を表現する。
◎
An ImageBitmap object represents a bitmap image that can be painted to a canvas without undue latency.
</p>

<p class="note">注記：
何を以って過度な待時間とするかの正確な判定は実装者に委ねられるが、
一般に，~bitmapの利用-時に
~network I/O, や~local~disk I/O を要するならば，
待時間はおそらく過度になる。
一方で，他を阻むのは GPU や~system RAM からの読取nに限られるならば、
待時間はおそらく受容-可能になる。
◎
The exact judgement of what is undue latency of this is left up to the implementer, but in general if making use of the bitmap requires network I/O, or even local disk I/O, then the latency is probably undue; whereas if it only requires a blocking read from a GPU or system RAM, the latency is probably acceptable.
</p>

<dl class="domintro">

	<dt>%promise = self.`createImageBitmap$m(%image [, %options ])</dt>
	<dt>%promise = self.`createImageBitmap$m(%image, %sx, %sy, %sw, %sh [, %options ])</dt>
	<dd>
所与の %image から［
新たな `ImageBitmap$I が作成されたときに解決される，~promise
］を返す
— %image は次に挙げるいずれかをとり得る
⇒＃
`img$e 要素 ／
`~SVG-image$ 要素 ／
`video$e 要素 ／
`canvas$e 要素 ／
`Blob$I ~obj ／
`ImageData$I ~obj ／
別の `ImageBitmap$I ~obj
◎
Takes image, which can be an img element, an SVG image element, a video element, a canvas element, a Blob object, an ImageData object, or another ImageBitmap object, and returns a promise that is resolved when a new ImageBitmap is created.
</dd>
	<dd>
`ImageBitmap$I ~objを構築できなかった場合
— 例えば、
供された %image の~dataは，実際には画像でなかったとき —
~promiseは却下される。
◎
If no ImageBitmap object can be constructed, for example because the provided image data is not actually an image, then the promise is rejected instead.
</dd>
	<dd>
%sx, %sy, %sw, %sh
引数が供された場合、
~source画像は，それらが成す矩形に切抜かれる
— 元の画像に無い画素は、
`透明な黒$に置換される。【！＊ clip？】
これらの座標は、
~source画像の~pixel座標~空間であり，`~CSS~pixel$数`ではない^em。
◎
If sx, sy, sw, and sh arguments are provided, the source image is cropped to the given pixels, with any pixels missing in the original replaced by transparent black. These coordinates are in the source image's pixel coordinate space, not in CSS pixels.
</dd>
	<dd>
%options が供された場合、
`ImageBitmap$I ~objの~bitmap~dataは， %options に則って改変される。
例えば［
%options[ "`premultiplyAlpha$m" ] ~EQ `premultiply$l
］ならば、
`~bitmap~data$の~alpha成分~以外の各~色~成分は，当の`~alpha成分により乗算済み＠~HEcanvas#concept-premultiplied-alpha$になる。
◎
If options is provided, the ImageBitmap object's bitmap data is modified according to options. For example, if the premultiplyAlpha option is set to "premultiply", the bitmap data's non-alpha color components are premultiplied by the alpha component.
</dd>
	<dd>
<p>
~source画像の状態が妥当でない場合、
%promise は `InvalidStateError$E で却下される
— 例えば， %image に応じて：
</p>
		<ul>
			<li>
`img$e 要素ならば、
成功裡に読込まれなかった場合
</li>
			<li>
`ImageBitmap$I ~objならば、［
その `Detached$sl 内部~slotの値 ~EQ ~T
］の場合
</li>
			<li>
`ImageData$I ~objならば、［
その `data$m 属性の値の `ViewedArrayBuffer^sl 内部~slotは `detached^en である
【 `IsDetachedBuffer$jA( 当の内部~slotの値 ) ~EQ ~T 】
］の場合
</li>
			<li>
`Blob$I ~objならば、
その~dataを~bitmap画像に解釈できない場合
</li>
		</ul>

◎
Rejects the promise with an "InvalidStateError" DOMException if the source image is not in a valid state (e.g., an img element that hasn't loaded successfully, an ImageBitmap object whose [[Detached]] internal slot value is true, an ImageData object whose data attribute value's [[ViewedArrayBuffer]] internal slot is detached, or a Blob whose data cannot be interpreted as a bitmap image).
</dd>
	<dd>
~scriptから~source画像の画像~dataへの~accessは許容されない場合、
%promise は `SecurityError$E 例外で却下される
（例：
`~CORS非同一-生成元$の `video$e ／
別の`生成元$からの~worker内の~scriptにより描かれている `canvas$e ）。
◎
Rejects the promise with a "SecurityError" DOMException if the script is not allowed to access the image data of the source image (e.g. a video that is CORS-cross-origin, or a canvas being drawn on by a script in a worker from another origin).
</dd>

	<dt>%imageBitmap.`close$m()</dt>
	<dd>
%imageBitmap の下層の`~bitmap~data$を解放する。
◎
Releases imageBitmap's underlying bitmap data.
</dd>

	<dt>%imageBitmap.`width$m</dt>
	<dd>
画像の`生来な横幅$を`~CSS~pixel$数で返す。
◎
Returns the natural width of the image, in CSS pixels.
</dd>

	<dt>%imageBitmap.`height$m</dt>
	<dd>
画像の`生来な縦幅$を`~CSS~pixel$数で返す。
◎
Returns the natural height of the image, in CSS pixels.
</dd>
</dl>

<p>
各 `ImageBitmap$I %O は：
◎
↓</p>

<ul>
	<li>
［
%O の `Detached$sl 内部~slotの値 ~EQ ~F
］ならば、
［
横幅, 縦幅
］を伴う
`~bitmap~data@
が常に結付けられる
【~T にされたときは、この~dataは解放される（ ε にされる）】
。
しかしながら、
この~dataは破損していることもあり得る。
`ImageBitmap$I ~objは、
その~media~dataが~errorなしに復号できるならば，
`全部的に復号-可能@
と呼ばれる。
◎
An ImageBitmap object whose [[Detached]] internal slot value is false always has associated bitmap data, with a width and a height. However, it is possible for this data to be corrupted. If an ImageBitmap object's media data can be decoded without errors, it is said to be fully decodable.
</li>
	<li>
%O の~bitmapは、
`生成元cleanか$を有する
— それは、［
当の~bitmapが，異なる`生成元$からの内容に染まっていない（ `tainted^en でない）か否か
］を指示する。
この~flagは、
初期~時には ~T に設定され（染まっていない），
`createImageBitmap()$m の手続きにより ~F に変化し得る。
◎
An ImageBitmap object's bitmap has an origin-clean flag, which indicates whether the bitmap is tainted by content from a different origin. The flag is initially set to true and may be changed to false by the steps of createImageBitmap().
</li>
</ul>

<p>
各 `ImageBitmap$I は、
`直列化-可能$であり，`転送-可能$である：
◎
ImageBitmap objects are serializable objects and transferable objects.
</p>

<ul>
	<li class="algo">
<p>
その`直列化~手続き$は、
所与の
( %値, %直列形 )
に対し：
◎
Their serialization steps, given value and serialized, are:
</p>
		<ol>
			<li>
~IF［
%値 の`生成元cleanか$ ~EQ ~F
］
⇒
~THROW `DataCloneError$E
◎
If value's origin-clean flag is not set, then throw a "DataCloneError" DOMException.
</li>
			<li>
%直列形.`BitmapData^sl ~SET %値 の`~bitmap~data$の複製
◎
Set serialized.[[BitmapData]] to a copy of value's bitmap data.
</li>
		</ol>
	</li>
	<li class="algo">
<p>
その`逆直列化~手続き$は、
所与の
( %直列形, %値, %宛先~realm )
に対し：
◎
Their deserialization steps, given serialized, value, and targetRealm, are:
</p>
		<ol>
			<li>
%値 の`~bitmap~data$ ~SET  %直列形.`BitmapData^sl
◎
Set value's bitmap data to serialized.[[BitmapData]].
</li>
		</ol>
	</li>
	<li class="algo">
<p>
その`転送-手続き$は、
所与の
( %値, %~data保持体 )
に対し：
◎
Their transfer steps, given value and dataHolder, are:
</p>
		<ol>
			<li>
~IF［
%値 の`生成元cleanか$ ~EQ ~F
］
⇒
~THROW `DataCloneError$E
◎
If value's origin-clean flag is not set, then throw a "DataCloneError" DOMException.
</li>
			<li>
%~data保持体.`BitmapData^sl ~SET %値 の`~bitmap~data$
◎
Set dataHolder.[[BitmapData]] to value's bitmap data.
</li>
			<li>
%値 の`~bitmap~data$ ~SET ε
◎
Unset value's bitmap data.
</li>
		</ol>
	</li>
	<li class="algo">
<p>
その`転送-受信-時の手続き$は、
所与の
( %~data保持体, %値 )
に対し：
◎
Their transfer-receiving steps, given dataHolder and value, are:
</p>
		<ol>
			<li>
%値 の`~bitmap~data$ ~SET %~data保持体.`BitmapData^sl
◎
Set value's bitmap data to dataHolder.[[BitmapData]].
</li>
		</ol>
	</li>
</ul>

<hr>

<div class="algo">
<p>
［
`createImageBitmap(image, options)@m
／
`createImageBitmap(image, sx, sy, sw, sh, options)^m
］~method手続きは：
◎
The createImageBitmap(image, options) and createImageBitmap(image, sx, sy, sw, sh, options) methods, when invoked, must run these steps:
</p>
<ol>
	<li>
%xywh ~LET ~IS［
この手続きは %sx, %sy, %sw, %sh 引数をとる方の~methodにより呼出された
］
◎
↓</li>
	<li>
~IF［
%xywh ~EQ ~T
］
⇒
~IF［
%sw ~EQ 0
］~OR［
%sh ~EQ 0
］
⇒＃
~RET `却下される~promise$( `RangeError$E 例外 )
◎
If either sw or sh is given and is 0, then return a promise rejected with a RangeError.
</li>
	<li>
`~resize横幅@V ~LET %options[
"`resizeWidth@m"
]
◎
↓</li>
	<li>
`~resize縦幅@V ~LET %options[
"`resizeHeight@m"
]
◎
↓</li>
	<li>
~IF［
`~resize横幅$V ~EQ 0
］~OR［
`~resize横幅$V ~EQ 0
］
⇒＃
`却下される~promise$( `InvalidStateError$E 例外 )
◎
If either options's resizeWidth or options's resizeHeight is present and is 0, then return a promise rejected with an "InvalidStateError" DOMException.
</li>
	<li>
<p>
%検査~結果 ~LET `画像~引数は利用-可能か検査する$( %image )
◎
Check the usability of the image argument.＼
</p>

<p>
例外が投出されたときは、
~catchして
⇒
%検査~結果 ~SET `不良^i
◎
If this throws an exception＼
</p>
	</li>
	<li>
~IF［
%検査~結果 ~EQ `不良^i
］
⇒
~RET `却下される~promise$( `InvalidStateError$E 例外 )
◎
or returns bad, then return a promise rejected with an "InvalidStateError" DOMException.
</li>
	<li>
%promise ~LET `新たな~promise$
◎
Let p be a new promise.
</li>
	<li>
<p>
以下を遂行する：
</p>

<p class="trans-note">【
この訳では，原文の~algoを再構成している
— その重複している~logicを この段の中に集約して，
重複していない部分を 下の “`~bitmap~dataを取得する$” に抜き出すことにより。
】</p>
		<ol>
			<li class="algo">
<p>
%~bitmapを得る手続き ~LET 次を走らす手続き：
</p>
				<ol>
					<li>
( %~bitmap~data, %生成元cleanか ) ~LET `~bitmap~dataを取得する$( %image )
</li>
					<li>
~IF［
%~bitmap~data ~EQ ε
］
⇒
~RET ε
</li>
					<li>
%O ~LET 新たな `ImageBitmap$I ~obj
</li>
					<li>
%O の`~bitmap~data$ ~SET `~source矩形に切抜いて整形する$( %~bitmap~data )
</li>
					<li>
%O の~bitmapの`生成元cleanか$ ~SET %生成元cleanか
</li>
					<li>
~RET %O
</li>
				</ol>
</li>
			<li>
<p>
~IF［
%image は `Blob$I ~objである
］：
</p>
				<ol>
					<li class="algo">
<p>
この段は、
`並列的$に走らす：
</p>
						<ol>
							<li>
%~bitmap ~LET %~bitmapを得る手続き()
</li>
							<li>
~IF［
%~bitmap ~NEQ ε
］
⇒
`~promiseを解決する$( %promise, %~bitmap )
</li>
							<li>
~ELSE
⇒
`~promiseを却下する$( %promise, `InvalidStateError$E 例外 )
</li>
						</ol>
					</li>
				</ol>
			</li>
			<li>
<p>
~ELSE：
</p>
				<ol>
					<li>
%~bitmap ~LET %~bitmapを得る手続き()
</li>
					<li>
~IF［
%~bitmap ~EQ ε
］
⇒
~RET `却下される~promise$( `InvalidStateError$E 例外 )
</li>
					<li class="algo">
次を`並列的$に走らす
⇒
`~promiseを解決する$( %promise, %~bitmap )
</li>
				</ol>
</li>
			<li>
~RET %promise
</li>
		</ol>
◎
↓</li>
</ol>

<div class="algo">
<p>
上の手続きにて
`~bitmap~dataを取得する@
下位-手続きは、
所与の
( %image )
に対し，
%image に応じて次を走らす：
◎
Let imageBitmap be a new ImageBitmap object.
◎
Switch on image:
</p>

<dl class="switch">
	<dt>`img$e</dt>
	<dt>`~SVG-image$</dt>
	<dd>
		<ol>
			<li>
%寸法 ~LET %image の~media~dataの`生来な寸法$
◎
↓</li>
			<li>
<p>
~IF［
%寸法 ~EQ ε
（例：内容~sizeが指定されていない~vector~graphic）
］：
</p>
				<ol>
					<li>
~IF［
`~resize横幅$V ~EQ ε
］~OR［
`~resize縦幅$V ~EQ ε
］
⇒
~RET ( ε, ε )
</li>
					<li>
~UAは、
%image を~size
( `~resize横幅$V, `~resize縦幅$V )
の~bitmapに描画するべきである 【 “べき” とは？】
</li>
				</ol>

◎
If image's media data has no natural dimensions (e.g., it's a vector graphic with no specified content size) and either options's resizeWidth or options's resizeHeight is not present, then a promise rejected with an "InvalidStateError" DOMException.
◎
If image's media data has no natural dimensions (e.g., it's a vector graphic with no specified content size), it should be rendered to a bitmap of the size specified by the resizeWidth and the resizeHeight options.
</li>
			<li>
%~bitmap~data ~LET %image の~media~dataを`代表する~bitmap~data$の複製
◎
Set imageBitmap's bitmap data to a copy of image's media data, cropped to the source rectangle with formatting. If this is an animated image, imageBitmap's bitmap data must only be taken from the default image of the animation (the one that the format defines is to be used when animation is not supported or is disabled), or, if there is no such image, the first frame of the animation.
</li>
			<li>
%生成元cleanか ~LET ~IS［
~NOT %image `引数は生成元cleanでない$
］
◎
If image is not origin-clean, then set the origin-clean flag of imageBitmap's bitmap to false.
</li>
			<li>
~RET ( %~bitmap~data, %生成元cleanか )
◎
Run this step in parallel:
• Resolve p with imageBitmap.
</li>
		</ol>
	</dd>

	<dt>`video$e</dt>
	<dd>
		<ol>
			<li>
~IF［
%image の `networkState$m 属性~値 ~EQ `NETWORK_EMPTY$m
］
⇒
~RET ( ε, ε )：
◎
If image's networkState attribute is NETWORK_EMPTY, then return a promise rejected with an "InvalidStateError" DOMException.
</li>
			<li>
%~bitmap~data ~LET `現在の再生位置$にある~frameの複製
— その~sizeは
`~media資源$の
( `生来な横幅$video, `生来な縦幅$video ) 
とする
（すなわち，縦横比による補正は適用-済み）
◎
Set imageBitmap's bitmap data to a copy of the frame at the current playback position, at the media resource's natural width and natural height (i.e., after any aspect-ratio correction has been applied), cropped to the source rectangle with formatting.
</li>
			<li>
%生成元cleanか ~LET ~IS［
~NOT %image `引数は生成元cleanでない$
］
◎
If image is not origin-clean, then set the origin-clean flag of imageBitmap's bitmap to false.
</li>
			<li>
~RET ( %~bitmap~data, %生成元cleanか )
◎
Run this step in parallel:
• Resolve p with imageBitmap.
</li>
		</ol>
	</dd>

	<dt>`canvas$e</dt>
	<dd>
		<ol>
			<li>
~RET ( %image の`~bitmap~data$の複製, %image の~bitmapの`生成元cleanか$ )
◎
Set imageBitmap's bitmap data to a copy of image's bitmap data, cropped to the source rectangle with formatting.
◎
Set the origin-clean flag of the imageBitmap's bitmap to the same value as the origin-clean flag of image's bitmap.
◎
Run this step in parallel:
• Resolve p with imageBitmap.
</li>
		</ol>
	</dd>

	<dt>`Blob$I ~obj</dt>
	<dd>
		<ol>
			<li>
%画像~data ~LET %image から~dataを読取る
【`読取n演算＠~FILEAPI#readOperation$により？】
⇒
`読取る間に~errorが生じた＠~FILEAPI#file-error-read$ときは
⇒
~RET ( ε, ε )
◎
Run these steps in parallel:
◎
Let imageData be the result of reading image's data. If an error occurs during reading of the object, then reject p with an "InvalidStateError" DOMException and abort these steps.
</li>
			<li>
%画像~data の公式的な型 ~LET ［
%image の `type$m 属性で与えられる~MIME型
］を与える下で，`画像を特定的に~sniffするための規則$を適用して、
%画像~data の~file形式を決定した結果
◎
Apply the image sniffing rules to determine the file format of imageData, with MIME type of image (as given by image's type attribute) giving the official type.
</li>
			<li>
<p>
~IF［
~OR↓
］…
</p>
				<ul>
					<li>
%画像~data の公式的な型は~supportされる画像~file形式でない
（例：画像でない）
</li>
					<li>
%画像~data は破損している
</li>
					<li>
%画像~data から寸法を得せない
（例： `生来な~size$を伴わない~vector~graphic）
</li>
				</ul>
<p>
…ならば
⇒
~RET ( ε, ε )
</p>
◎
If imageData is not in a supported image file format (e.g., it's not an image at all), or if imageData is corrupted in some fatal way such that the image dimensions cannot be obtained (e.g., a vector graphic with no natural size), then reject p with an "InvalidStateError" DOMException and abort these steps.
</li>
			<li>
%~bitmap~data ~LET %画像~data を`代表する~bitmap~data$
◎
Set imageBitmap's bitmap data to imageData, cropped to the source rectangle with formatting. If this is an animated image, imageBitmap's bitmap data must only be taken from the default image of the animation (the one that the format defines is to be used when animation is not supported or is disabled), or, if there is no such image, the first frame of the animation.
</li>
			<li>
~RET ( %~bitmap~data, ~T )
◎
Resolve p with imageBitmap.
</li>
		</ol>
	</dd>

	<dt>`ImageData$I</dt>
	<dd>
		<ol>
			<li>
~IF［
`IsDetachedBuffer$jA( %image の `data$m 属性~値の `ViewedArrayBuffer^sl 内部~slotの値 ) ~EQ ~T
］
⇒
~RET ( ε, ε )
◎
Let buffer be image's data attribute value's [[ViewedArrayBuffer]] internal slot.
◎
If IsDetachedBuffer(buffer) is true, then return a promise rejected with an "InvalidStateError" DOMException.
</li>
			<li>
~RET ( %image が与える画像~data, ~T )
◎
Set imageBitmap's bitmap data to image's image data, cropped to the source rectangle with formatting.
◎
Run this step in parallel:
• Resolve p with imageBitmap.
</li>
		</ol>
	</dd>

	<dt>`ImageBitmap$I</dt>
	<dd>
		<ol>
			<li>
~RET ( %image の`~bitmap~data$の複製, %image の~bitmapの`生成元cleanか$ )
◎
Set imageBitmap's bitmap data to a copy of image's bitmap data, cropped to the source rectangle with formatting.
◎
Set the origin-clean flag of imageBitmap's bitmap to the same value as the origin-clean flag of image's bitmap.
◎
Run this step in parallel:
• Resolve p with imageBitmap.
</li>
		</ol>
	</dd>

	<dt>`VideoFrame$I</dt>
	<dd>
		<ol>
			<li>
~RET ( %image の可視な画素~dataの複製, ~T )
◎
Set imageBitmap's bitmap data to a copy of image's visible pixel data, cropped to the source rectangle with formatting.
◎
Run this step in parallel:
• Resolve p with imageBitmap.
</li>
		</ol>
	</dd>
</dl>

<p>
◎
↑↑Return p.
</p>
</div>

<div class="algo">
<p>
所与の %画像~data を
`代表する~bitmap~data@
は、
次の結果を返す：
</p>
<ol>
	<li>
~IF［
%画像~data は~animated画像でない
］
⇒
~RET %画像~data
</li>
	<li>
~RET ［
%画像~data の形式にて［
~animationは~supportされないか不能化されている
］ときに利用するものと定義された既定の画像
］は［
在るならば それ／
無いならば~animationを成す最初の~frame
］
</li>
</ol>

◎
↑</div>

<div class="algo">
<p>
上で利用される
`~source矩形に切抜いて整形する@
下位-手続きは、
所与の
( `~bitmap~data$ %入力 )
に対し：
◎
When the steps above require that the user agent crop bitmap data to the source rectangle with formatting, the user agent must run the following steps:
• Let input be the bitmap data being transformed.
</p>
<ol>
	<li>
<p>
%~source矩形 ~LET %xywh に応じて，各側が次の表tで与えられる矩形：
</p>

<table>
<thead><tr>
<td>
<th>%xywh ~EQ ~T
<th>%xywh ~EQ ~F
<tbody>

<tr><th>左端
<td>min( %sx, %sx + %sw )
<td>0

<tr><th>上端
<td>min( %sy, %sy + %sh )
<td>0

<tr><th>右端
<td>max( %sx, %sx + %sw )
<td>%入力 の横幅

<tr><th>下端
<td>max( %sy, %sy + %sh )
<td>%入力 の縦幅
</table>

<!-- 
［
%sw ／ %sh
］が負ならば、この矩形の左上隅は，点 ( %sx, %sy ) の 左／上になる。
-->
◎
If sx, sy, sw and sh are specified, let sourceRectangle be a rectangle whose corners are the four points (sx, sy), (sx+sw, sy), (sx+sw, sy+sh), (sx, sy+sh). Otherwise, let sourceRectangle be a rectangle whose corners are the four points (0, 0), (width of input, 0), (width of input, height of input), (0, height of input).
◎
If either sw or sh are negative, then the top-left corner of this rectangle will be to the left or above the (sx, sy) point.
</li>
	<li>
( %横幅, %縦幅 ) ~LET %~source矩形 の ( 横幅, 縦幅 )
</li>
	<li>

<p>
( %出力~横幅, %出力~縦幅 ) ~LET
(`~resize横幅$V, `~resize縦幅$V )
に応じて，次の表tで与えられる値を整数に切り上げた結果：
</p>

<table><thead>
<tr><th>`~resize横幅$V
<th>`~resize縦幅$V
<th>%出力~横幅
<th>%出力~縦幅
<tbody>

<tr><td>非ε
<td>非ε
<td>`~resize横幅$V
<td>`~resize縦幅$V

<tr><td>非ε
<td>ε
<td>`~resize横幅$V
<td>%縦幅 × `~resize横幅$V ÷ %横幅

<tr><td>ε
<td>非ε
<td>%横幅 × `~resize縦幅$V ÷ %縦幅
<td>`~resize縦幅$V

<tr><td>ε
<td>ε
<td>%横幅
<td>%縦幅
</table>

◎
Let outputWidth be determined as follows:
• If the resizeWidth member of options is specified
•• the value of the resizeWidth member of options
• If the resizeWidth member of options is not specified, but the resizeHeight member is specified
•• the width of sourceRectangle, times the value of the resizeHeight member of options, divided by the height of sourceRectangle, rounded up to the nearest integer
• If neither resizeWidth nor resizeHeight are specified
•• the width of sourceRectangle
◎
Let outputHeight be determined as follows:
• If the resizeHeight member of options is specified
•• the value of the resizeHeight member of options
• If the resizeHeight member of options is not specified, but the resizeWidth member is specified
•• the height of sourceRectangle, times the value of the resizeWidth member of options, divided by the width of sourceRectangle, rounded up to the nearest integer
• If neither resizeWidth nor resizeHeight are specified
•• the height of sourceRectangle
</li>
	<li>
%平面 ~LET 
( x 軸は右向き, y 軸は下向き ) にされた, 広さ無限な, `透明な黒$の平面
◎
↓</li>
	<li>
<p>
%入力 を次に従って %平面 に~~合成する：
</p>
		<ul>
			<li>
%入力 の左上隅は、
%平面 の原点に位置する。
</li>
			<li>
%入力 画像~data内の各~画素は、
%平面 において縦横とも~size 1 の区画を占める。
</li>
		</ul>

◎
Place input on an infinite transparent black grid plane, positioned so that its top left corner is at the origin of the plane, with the x-coordinate increasing to the right, and the y-coordinate increasing down, and with each pixel in the input image data occupying a cell on the plane's grid.
</li>
	<li>
%出力 ~LET %平面 上の %~source矩形 が占める矩形~内の画像
◎
Let output be the rectangle on the plane denoted by sourceRectangle.
</li>
	<li>
<p>
%出力 ~SET %出力 を~size
( %出力~横幅, %出力~縦幅 )
に拡縮した結果
◎
Scale output to the size specified by outputWidth and outputHeight.＼
</p>

<p>
これに利用する拡縮ng~algoは、
`resizeQuality$m ~optionの値を目安にするべきである。
◎
The user agent should use the value of the resizeQuality option to guide the choice of scaling algorithm.
</p>
	</li>
	<li>
<p>
%options[
"`imageOrientation@m"
]
に応じて：
</p>
		<ul class="switch">
			<li>
`flipY@l
⇒
%出力 を上下逆さに裏返す
— ~sourceに画像~方位~metadata（ `EXIF$r ~metadataなど）があっても無視rして
◎
If the value of the imageOrientation member of options is "flipY", output must be flipped vertically, disregarding any image orientation metadata of the source (such as EXIF metadata), if any. [EXIF]
</li>
			<li>
`from-image@l
⇒
何もしない
◎
If the value is "from-image", no extra step is needed.
</li>
		</ul>

<p class="note">注記：
列挙~値には `none^l も利用されていたが、
`from-image$l に改称された。
将来には、
`none^l を追加し直すことになる
— 異なる意味を伴わせて。
◎
There used to be a "none" enum value. It was renamed to "from-image". In the future, "none" will be added back with a different meaning.
</p>
	</li>
	<li>
<p>
~IF［
%image は `img$e 要素または `Blob$I ~objである
］
⇒
%options[
"`colorSpaceConversion@m"
] に応じて：
◎
If image is an img element or a Blob object, let val be the value of the colorSpaceConversion member of options, and then run these substeps:
</p>

		<ul class="switch">
			<li>
`~default0@l
⇒
色~空間の変換の挙動は、
実装に特有である
— 実装は、
画像を~canvasに描く際に利用する既定の色~空間に則って選ぶべきである。
◎
If val is "default", the color space conversion behavior is implementation-specific, and should be chosen according to the default color space that the implementation uses for drawing images onto the canvas.
</li>
			<li>
`~none0@l
⇒
%出力 は、
色~空間の変換を遂行することなく復号するモノトスル。
すなわち，画像を復号する~algoは、［
~source~data内に埋込まれている色~profile~metadata,
表示~機器の色~profile
］どちらも無視するモノトスル。
◎
If val is "none", output must be decoded without performing any color space conversions. This means that the image decoding algorithm must ignore color profile metadata embedded in the source data as well as the display device color profile.
</li>
		</ul>
	</li>
	<li>
<p>
%options[
"`premultiplyAlpha@m"
] に応じて：
◎
Let val be the value of premultiplyAlpha member of options, and then run these substeps:
</p>
		<ul class="switch">
			<li>
`default@l
⇒
%出力 を~alphaにより乗算済みにするかどうかは、
実装に特有である
— 実装は、［
画像を~canvasに描くために最適と判断されるもの
］に則って選ぶべきである。
◎
If val is "default", the alpha premultiplication behavior is implementation-specific, and should be chosen according to implementation deems optimal for drawing images onto the canvas.
</li>
			<li>
`premultiply@l
⇒
~IF［
%出力 は~alphaにより乗算済みでない
］
⇒
%出力 のすべての 色~成分を`~alphaで乗算する＠~HEcanvas#convert-to-premultiplied$
◎
If val is "premultiply", the output that is not premultiplied by alpha must have its color components multiplied by alpha and that is premultiplied by alpha must be left untouched.
</li>
			<li>
`none@l
⇒
~IF［
%出力 は~alphaにより乗算済みである
］
⇒
%出力 のすべての色~成分を`~alphaで除算する＠~HEcanvas#convert-from-premultiplied$
◎
If val is "none", the output that is not premultiplied by alpha must be left untouched and that is premultiplied by alpha must have its color components divided by alpha.
</li>
		</ul>
	</li>
	<li>
~RET %出力
◎
Return output.
</li>
</ol>
</div>
</div>

<div class="algo">
<p>
`close()@m
~method手続きは：
◎
The close() method steps are:
</p>
<ol>
	<li>
コレの `Detached$sl 内部~slotの値 ~SET ~T
◎
Set this's [[Detached]] internal slot value to true.
</li>
	<li>
コレの`~bitmap~data$ ~SET ε
◎
Unset this's bitmap data.
</li>
</ol>
</div>

<div class="algo">
<p>
`width@m
取得子~手続きは：
◎
The width getter steps are:
</p>
<ol>
	<li>
~IF［
コレの `Detached$sl 内部~slotの値 ~EQ ~T
］
⇒
~RET 0
◎
If this's [[Detached]] internal slot's value is true, then return 0.
</li>
	<li>
~RET `~CSS~pixel$数による，コレの横幅
◎
Return this's width, in CSS pixels.
</li>
</ol>
</div>

<div class="algo">
<p>
`height@m
取得子~手続きは：
◎
The height getter steps are:
</p>
<ol>
	<li>
~IF［
コレの `Detached$sl 内部~slotの値 ~EQ ~T
］
⇒
~RET 0
◎
If this's [[Detached]] internal slot's value is true, then return 0.
</li>
	<li>
~RET `~CSS~pixel$数による，コレの縦幅
◎
Return this's height, in CSS pixels.
</li>
</ol>
</div>

<p>
`resizeQuality@m
~memberは、
`ResizeQuality$I 列挙~値をとり，［
画像の拡縮-時に利用する補間~品質の選好
］を表出するために利用される
— とり得る値の意味は：
◎
The ResizeQuality enumeration is used to express a preference for the interpolation quality to use when scaling images.
</p>
<dl>
	<dt>`pixelated@l</dt>
	<dd>
アリな限り，元の画素~化【 “ドット” 】を保全するよう画像を拡縮する選好を指示する
— 加えて、
~target~sizeが元の~sizeの整数~倍でないときは，
画像を歪めるのを避けるために必要yなだけ少し滑らかにする。
◎
The "pixelated" value indicates a preference for scaling the image to preserve the pixelation of the original as much as possible, with minor smoothing as necessary to avoid distorting the image when the target size is not a clean multiple of the original.
</dd>
	<dd>
<p>
`pixelated$l を実装するためには：
</p>
		<ol>
			<li>
各~軸に対し独立に，当の画像の`生来な~size$の正な整数~倍を［
~target~sizeに最も近くなる
］よう決定する。
</li>
			<li>
最近傍~algo【`参照＠~CSSIMAGE#nearest-neighbor$】を利用して，
前~段による結果の整数~倍~sizeへ拡縮する。
</li>
			<li>
双線形~補間を利用して，~target~sizeへ拡縮する。
</li>
		</ol>

<p class="trans-note">【
参考：
`CSSIMAGES$r に定義される `image-rendering^p ~prop用の値 `pixelated＠~CSSIMAGE#valdef-image-rendering-pixelated$v とほぼ
— 最後の段が双線形~補間に限定されることを除いて —
同様になる。
】</p>
◎
To implement "pixelated", for each axis independently, first determine the integer multiple of its natural size that puts it closest to the target size and is greater than zero. Scale it to this integer-multiple-size using nearest neighbor, then scale it the rest of the way to the target size using bilinear interpolation.
</dd>

	<dt>`low@l</dt>
	<dd>
低~品質な画像~補間の選好を指示する。
計算量は `high$l より少なく済み得る。
◎
The "low" value indicates a preference for a low level of image interpolation quality. Low-quality image interpolation may be more computationally efficient than higher settings.
</dd>

	<dt>`medium@l</dt>
	<dd>
中間~品質な画像~補間の選好を指示する。
◎
The "medium" value indicates a preference for a medium level of image interpolation quality.
</dd>

	<dt>`high@l</dt>
	<dd>
高~品質な画像~補間の選好を指示する。
計算量は `low$l より多くなり得る。
◎
The "high" value indicates a preference for a high level of image interpolation quality. High-quality image interpolation may be more computationally expensive than lower settings.
</dd>
</dl>

<p class="note">注記：
双線形~拡縮-法は、
比較的~高速に画像を滑らかに補間するが，より低~品質な~algoの例である。
［
双三次 ／ Lanczos
］拡縮-法は、
より高~品質な出力を生産する画像~拡縮ng~algoの例である。
この仕様は、
上で述べた `pixelated$l 用のものを除いて，
特定の補間~algoの利用を義務付けない。
◎
Bilinear scaling is an example of a relatively fast, lower-quality image-smoothing algorithm. Bicubic or Lanczos scaling are examples of image-scaling algorithms that produce higher-quality output. This specification does not mandate that specific interpolation algorithms be used, except for "pixelated" as described above.
</p>

<div class="example">
<p>
この~APIを利用して、
~sprite-sheetを事前に切り分けて準備する例：
◎
Using this API, a sprite sheet can be precut and prepared:
</p>

<pre class="lang-js">
var %sprites = {};
function loadMySprites() {
  var %image = new Image();
  %image.src = 'mysprites.png';
  var %resolver;
  var %promise = new Promise(function (%arg) { %resolver = %arg });
  %image.onload = function () {
    %resolver(Promise.all([
      createImageBitmap(%image,  0,  0, 40, 40)
        .then(function (%image) { %sprites.person = %image }),
      createImageBitmap(%image, 40,  0, 40, 40)
        .then(function (%image) { %sprites.grass  = %image }),
      createImageBitmap(%image, 80,  0, 40, 40)
        .then(function (%image) { %sprites.tree  = %image }),
      createImageBitmap(%image,  0, 40, 40, 40)
        .then(function (%image) { %sprites.hut   = %image }),
      createImageBitmap(%image, 40, 40, 40, 40)
        .then(function (%image) { %sprites.apple = %image }),
      createImageBitmap(%image, 80, 40, 40, 40)
        .then(function (%image) { %sprites.snake = %image })
    ]));
  };
  return %promise;
}

function runDemo() {
  var %canvas = document.querySelector('canvas#demo');
  var %context = %canvas.getContext('2d');
  %context.drawImage(%sprites.tree, 30, 10);
  %context.drawImage(%sprites.snake, 70, 10);
}

loadMySprites().then(runDemo);
</pre>
</div>
		</section>
		<section id="animation-frames">
<h3 title="Animation frames">8.11. ~animation~frame</h3>

<p>
一部の~objは、
`AnimationFrameProvider$I ~interface~mixinを内包する。
◎
Some objects include the AnimationFrameProvider interface mixin.
</p>

<pre class="idl">
callback `FrameRequestCallback@I = undefined (`DOMHighResTimeStamp$I time);

interface mixin `AnimationFrameProvider@I {
  unsigned long `requestAnimationFrame$m(`FrameRequestCallback$I callback);
  undefined `cancelAnimationFrame$m(unsigned long handle);
};
`Window$I includes `AnimationFrameProvider$I;
`DedicatedWorkerGlobalScope$I includes `AnimationFrameProvider$I;</pre>

<p>
各 `AnimationFrameProvider$I ~objは、
自身の内部~状態を格納する
`~target~obj@
を有する
— それは、
~objに応じて次で定義される
⇒＃
`Window$I であるならば，それに`結付けられた文書$ ／
`DedicatedWorkerGlobalScope$I であるならば ~obj自身
◎
Each AnimationFrameProvider object also has a target object that stores the provider's internal state. It is defined as follows:
◎
If the AnimationFrameProvider is a Window
• The Window's associated Document
◎
If the AnimationFrameProvider is a DedicatedWorkerGlobalScope
• The DedicatedWorkerGlobalScope
</p>

<div class="p">
<p>
各`~target~obj$は、
次に挙げるものを有する：
</p>

<dl class="def-list">
	<dt>`~animation~frame~callback~map@</dt>
	<dd>
`有順序~map$。
初期~時には空になるモノトスル。
</dd>

	<dt>`~animation~frame~callback識別子@</dt>
	<dd>
~~整数。
初期~時には 0 になるモノトスル。
</dd>
</dl>

◎
Each target object has a map of animation frame callbacks, which is an ordered map that must be initially empty, and an animation frame callback identifier, which is a number that must initially be zero.
</div>

<p>
`AnimationFrameProvider$I は、
~OR↓ を満たすならば
`~supportされて@
いるものと見なされる：
◎
An AnimationFrameProvider provider is considered supported if any of the following are true:
</p>
<ul>
	<li>
`Window$I ~objである
◎
provider is a Window.
</li>
	<li>
【`DedicatedWorkerGlobalScope$I ~objであって】
その`所有者~集合$内に次を満たす~objが在る
⇒
［
`文書$である
］~OR［
`~supportされて$いる `DedicatedWorkerGlobalScope$I ~objである
］
◎
provider's owner set contains a Document object.
◎
Any of the DedicatedWorkerGlobalScope objects in provider's owner set are supported.
</li>
</ul>

<hr>

<div class="algo">
<p>
`requestAnimationFrame(callback)@m
~method手続きは：
◎
The requestAnimationFrame(callback) method steps are:
</p>
<ol>
	<li>
~IF［
コレは`~supportされて$いない
］
⇒
~THROW `NotSupportedError$E
◎
If this is not supported, then throw a "NotSupportedError" DOMException.
</li>
	<li>
%~target ~LET コレの`~target~obj$
◎
Let target be this's target object.
</li>
	<li>
%~target の`~animation~frame~callback識別子$ ~INCBY 1
◎
Increment target's animation frame callback identifier by one,＼
</li>
	<li>
%~handle ~LET %~target の`~animation~frame~callback識別子$
◎
and let handle be the result.
</li>
	<li>
%~target の`~animation~frame~callback~map$[ %~handle ] ~SET %~callback
◎
Let callbacks be target's map of animation frame callbacks.
◎
Set callbacks[handle] to callback.
</li>
	<li>
~RET %~handle
◎
Return handle.
</li>
</ol>
</div>

<div class="algo">
<p>
`cancelAnimationFrame(handle)@m
~method手続きは：
◎
The cancelAnimationFrame(handle) method steps are:
</p>
<ol>
	<li>
~IF［
コレは`~supportされて$いない
］
⇒
~THROW `NotSupportedError$E
◎

If this is not supported, then throw a "NotSupportedError" DOMException.
</li>
	<li>
コレの`~target~obj$の`~animation~frame~callback~map$[ %handle ] ~SET ε
◎
Let callbacks be this's target object's map of animation frame callbacks.
◎
Remove callbacks[handle].
</li>
</ol>
</div>

<div class="algo">
<p>
`各~animation~frame~callbackを走らす@
~algoは、
所与の
( `~target~obj$ %~target, 時刻印 %now )
に対し：
◎
To run the animation frame callbacks for a target object target with a timestamp now:
</p>
<ol>
	<li>
%~callback~map ~LET %~target の`~animation~frame~callback~map$
◎
Let callbacks be target's map of animation frame callbacks.
</li>
	<li>
%~callback~handle群 ~LET %~callback~map の`~key群$map
◎
Let callbackHandles be the result of getting the keys of callbacks.
</li>
	<li>
<p>
%~callback~handle群 を成す
~EACH( %~handle )
に対し：
◎
For each handle in callbackHandles, if handle exists in callbacks:
</p>
		<ol>
			<li>
%~callback ~LET %~callback~map[ %~handle ]
◎
Let callback be callbacks[handle].
</li>
			<li>
~IF［
%~callback ~EQ ε
］
⇒
~CONTINUE
◎
↑</li>
			<li>
%~callback~map[ %~handle ] ~SET ε
◎
Remove callbacks[handle].
</li>
			<li>
`~callback関数を呼出す$( %~callback, « %now », `報告する^i )
◎
Invoke callback with « now » and "report".
</li>
		</ol>
	</li>
</ol>
</div>

<div class="example">
<p>
~workerの内側では、
`requestAnimationFrame()$m は，
`canvas$e 要素から転送された `OffscreenCanvas$I と一緒に利用できる。
先ず文書~内で，制御を~workerへ転送する：
◎
Inside workers, requestAnimationFrame() can be used together with an OffscreenCanvas transferred from a canvas element. First, in the document, transfer control to the worker:
</p>

<pre class="lang-js">
const %offscreenCanvas = document.getElementById("c").transferControlToOffscreen();
%worker.postMessage(%offscreenCanvas, [%offscreenCanvas]);
</pre>

<p>
次に，~worker内の次の~codeは、
左から右へ動く矩形を描くことになる：
◎
Then, in the worker, the following code will draw a rectangle moving from left to right:
</p>

<pre class="lang-js">
let %ctx, %pos = 0;
function draw(%dt) {
  %ctx.clearRect(0, 0, 100, 100);
  %ctx.fillRect(%pos, 0, 10, 10);
  %pos += 10 * %dt;
  requestAnimationFrame(%draw);
}

self.onmessage = function(%ev) {
  const %transferredCanvas = %ev.data;
  %ctx = %transferredCanvas.getContext("2d");
  draw();
};
</pre>
</div>

		</section>
</main>