HTMLのレンダリング

レンダリング (Web)

[72] 本項では HTMLレンダリングについて触れます。

目次

  1. 仕様書
  2. レンダリングのタイミング
  3. レンダリング処理モデル
  4. 利用者エージェント・スタイル・シート
    1. 歴史
      1. CSS 仕様書
    2. 実装
      1. WebKit
      2. KHTML
    3. メモ
  5. 表現的ヒント
  6. 概念
  7. 試験例
  8. 歴史

仕様書#

レンダリングのタイミング#

[90] navigate におけるレンダリングの更新については、 HTMLのレンダリングの開始を参照してください。

[91] イベントループレンダリングの関係については、 イベントループレンダリングの更新を参照してください。

[93] input 要素type 属性が変更された時、レンダリングが更新されます >>92

[9] requestAnimationFrame

[18] 事前レンダリング

[19] FOUC も参照。

レンダリング処理モデル#

[17] レンダリングの方法は色々あります。

利用者エージェント・スタイル・シート#

[71] HTML 文書レンダリングについて用いられることが期待される利用者エージェント・スタイル・シートHTML Living Standard で規定されています >>70

歴史#

CSS 仕様書#

[68] CSS 仕様書には、参考として HTML 文書用の利用者エージェント・スタイル・シート例が示されています。

[10] IW:CSS1:"#appendix-a"

実装#

WebKit#

[1] /trunk/WebCore/css/html4.css - WebKit - Trac http://trac.webkit.org/projects/webkit/browser/trunk/WebCore/css/html4.css

[14] ( 版) http://svn.webkit.org/repository/webkit/trunk/WebCore/css/html4.css

[2] /trunk/WebCore/css/quirks.css - WebKit - Trac http://trac.webkit.org/projects/webkit/browser/trunk/WebCore/css/quirks.css

KHTML#

[4] KDE Repository - log - SVN: branches/KDE/3.5/kdelibs/khtml/css/html4.css http://websvn.kde.org/branches/KDE/3.5/kdelibs/khtml/css/html4.css (名無しさん)

[5] KDE Repository - log - SVN: branches/KDE/3.5/kdelibs/khtml/css/quirks.css http://websvn.kde.org/branches/KDE/3.5/kdelibs/khtml/css/quirks.css?rev=597669&view=log (名無しさん)

[6] KDE Repository - log - SVN: trunk/KDE/kdelibs/khtml/css/html4.css http://websvn.kde.org/trunk/KDE/kdelibs/khtml/css/html4.css (名無しさん)

[7] KDE Repository - log - SVN: trunk/KDE/kdelibs/khtml/css/quirks.css http://websvn.kde.org/trunk/KDE/kdelibs/khtml/css/quirks.css

メモ#

[8] デフォルトスタイルの差異を無くすCSS (3ping.org 著, 2007-01-18 09:33:28 +09:00 版) http://3ping.org/2006/04/09/0747 (名無しさん 2007-01-18 05:26:10 +00:00)

表現的ヒント#

[73] HTML 仕様では表現的要素属性についての期待されるレンダリング表現的ヒントとして規定されています >>70

概念#

試験例#

歴史#

[21] The Base Stylesheet, , https://web.archive.org/web/19990222082453/http://www.verso.com/agitprop/corestyle/base.html

[76] 文書中の情報表現される動作。この表現はその環境に置いて最も適当な形態 (例: 聴覚的, 視覚的, 印刷) で行われる。 http://www.w3.org/TR/xhtml1/#general

[11] RE: [CSS21] Why are browser default style values different from Appendix D (Saloni Mira Rai 著, 2008-05-01 06:52:49 +09:00 版) http://lists.w3.org/Archives/Public/www-style/2008Apr/0518.html

[12] CSS2.1 User Agent Style Sheet Defaults ( 版) http://css-class.com/test/css/defaults/UA-style-sheet-defaults.htm

[15] Re: Default (informal) Style Sheet (Ian Hickson 著, 版) http://lists.w3.org/Archives/Public/public-html/2009Feb/0198.html

[74] CSS Print Profile ( ( 版)) http://www.w3.org/TR/2013/NOTE-css-print-20130314/#s.8.5.1

[75] Bug 21403 – HTML 5 spec should address how alt text is copied to a plain text pasteboard ( ( 版)) https://www.w3.org/Bugs/Public/show_bug.cgi?id=21403

[77] Web 関連規格, たとえば HTMLXML は特定の装置による表現から一定の距離を置く方針を採っています。 レンダリング, rendering, render という語は、 display のような視覚的意味が強い語の代替として選ばれているようなきらいがあります。 (そうはいっても、 render>>3 のように視覚的印象が強いことは否めませんが・・・。)

[78] W3C におけるレンダリング: W3C の仕様では rendering という語はよく使われますが、 用語として rendering を定義した仕様はないようです。

CSS視覚レンダリング・モデルを規定していますし、 SVGレンダリング・モデルを規定しています。 しかしいずれも rendering という語そのものは定義していません。 なお、 CSS の仕様書には音声レンダリング (aural rendering) という用語も登場します (が、こちらも未定義語です)。 なお、一般には speech rendering という語も使われているようです。

[79] >>76 XHTML 1.0 で定義されていました。 ちゃんと検索してから >>76 を書いたのにorz

[80]

レンダリング (rendering)
レンダリングとは、文書情報を提示する行為です。 この提示は環境でもっとも適切な形 (例えば音声的、視覚的、印刷) で行います。

[82] 最速チュパカブラ研究会 ( 版) http://d.hatena.ne.jp/gyuque/20070327#1175005196 (名無しさん 2007-06-15 13:03:46 +00:00)

[20] [Paint Performance] - Exposing paint rects to the DOM ( (Patrick Meenan 著, 版)) http://lists.w3.org/Archives/Public/public-web-perf/2013Aug/0040.html

[83] Servo/StyleUpdateOnDOMChange - MozillaWiki ( ( 版)) https://wiki.mozilla.org/Servo/StyleUpdateOnDOMChange

[84] Incremental flow tree construction · mozilla/servo Wiki ( ( 版)) https://github.com/mozilla/servo/wiki/Incremental-flow-tree-construction

[85] HTML Standard ( ( 版)) http://www.whatwg.org/specs/web-apps/current-work/#semantics-0

[86] Rendering and compositing out of process iframes - The Chromium Projects ( ( 版)) http://www.chromium.org/developers/design-documents/oop-iframes/oop-iframes-rendering

[87] Surfin' Safari - Blog Archive » WebCore Rendering I – The Basics ( ( 版)) https://www.webkit.org/blog/114/webcore-rendering-i-the-basics/

[88] Re: Beginning of a spec on style batching/flushing? ( (Boris Zbarsky 著, 版)) http://lists.w3.org/Archives/Public/www-style/2013Dec/0214.html

[89] JavaScript Grid with One Million Records | JavaScript UI - w2ui ( ( 版)) http://w2ui.com/web/blog/7/JavaScript-Grid-with-One-Million-Records

[3] Introduction to Layout in Mozilla | MDN ( 版) https://developer.mozilla.org/en-US/docs/Introduction_to_Layout_in_Mozilla

[13] 28954 – Clarify that suggested default rendering CSS is overridable unless stated otherwise ( 版) https://www.w3.org/Bugs/Public/show_bug.cgi?id=28954

[16] Add "i" flag to selectors in rendering section ( (shvaikalesh著, )) https://github.com/whatwg/html/commit/f352200eb1265b228f66e2ebc8a10b977a3f68fd