Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Prerendering Chapter 0

Prerendering Chapter 0

Study on the Gecko engine.
iCloud sharing can be found at http://tinyurl.com/zbhw3sg

1da96dc32c2993de010ca236dbc267bc?s=128

Samael Wang

April 06, 2016
Tweet

More Decks by Samael Wang

Other Decks in Technology

Transcript

  1. PRERENDERING CHAPTER 0

  2. None
  3. UI COMPONENTS

  4. Firefox

  5. nsWebShellWindow

  6. nsWebShellWindow browser.xul

  7. nsWebShellWindow <tabbrowser/> browser.xul

  8. browser.xul <tabbrowser/> <browser/> <browser/> <browser/> content.js DocShell XPCOM Module browser.js

    … browser/base/content/browser.xul browser/base/content/tabbrowser.xml toolkit/content/widgets/browser.xml toolkit/content/widgets/remote-browser.xml browser/base/content/global-scripts.inc browser/base/content/browser.js browser/base/content/content.js major source files Usually referred as “gBrowser”
  9. browser.xul <tabbrowser/> <remote-browser/> <remote-browser/> <remote-browser/> (content process) browser-child.js message manager

    browser-child.js message manager message manager browser-child.js content.js browser.js … DocShell XPCOM Module DocShell XPCOM Module PBrowser.ipdl
  10. Fennec

  11. BrowserApp (Activity)

  12. BrowserApp (Activity) gecko_app.xml (native UI)

  13. BrowserApp (Activity) org.mozilla.gecko.GeckoView gecko_app.xml (native UI)

  14. GeckoView browser.xul <deck/> <browser/> <browser/> <browser/> DocShell XPCOM Module browser.js

    mobile/android/ base/java/org/mozilla/gecko/BrowserApp.java base/java/org/mozilla/gecko/GeckoAppShell.java base/java/org/mozilla/gecko/GeckoThread.java base/java/org/mozilla/gecko/GeckoView.java base/java/org/mozilla/gecko/mozglue/GeckoLoader.java chrome/content/browser.xul chrome/content/browser.js widget/android/AndroidJNI.cpp major source files
  15. BROWSER CONCEPT https://www.w3.org/TR/html5/

  16. Browsing context A browsing context is an environment in which

    Document objects are presented to the user. The docshell is the toplevel object responsible for managing a single browsing context.
  17. Session History The sequence of Documents in a browsing context

    is its session history. Session history consists of a flat list of session history entries. Session history entry = URL + state + title + Document + form data + scroll position + …, etc. interface History { readonly attribute long length; readonly attribute any state; void go(optional long delta); void back(); void forward(); void pushState(any data, DOMString title, optional DOMString? url = null); void replaceState(any data, DOMString title, optional DOMString? url = null); };
  18. Window /*sealed*/ interface Window : EventTarget { // the current

    browsing context [Unforgeable] readonly attribute WindowProxy window; [Unforgeable] readonly attribute Document document; readonly attribute History history; // other browsing contexts [Unforgeable] readonly attribute WindowProxy top; [Replaceable] readonly attribute WindowProxy parent; WindowProxy open(optional DOMString url = "about:blank", optional DOMString target = “_blank”, [TreatNullAs=EmptyString] optional DOMString features = "", optional boolean replace = false); getter WindowProxy (unsigned long index); getter object (DOMString name); // the user agent readonly attribute Navigator navigator; }; (Partial) Window IDL definition
  19. WindowProxy credit: http://d.hatena.ne.jp/cou929_la/20110310/1299767973 var w = window.open();

  20. Split Window In SpiderMonkey, a split object is made up

    of two JSObjects: an inner object and an outer object. The inner window object is different for each page a browser window visits. It serves as the "globals" object and provides the JSPrincipals for scripts on that page. The outer window object is the object returned by window.open. It represents the window or tab itself and survives as the user navigates in that window or tab. The inner window => HTML5 Window object. The outer window => HTML5 WindowProxy object.
  21. Nested Windows

  22. Nested Windows browsing context

  23. Nested Windows var w = window.self; browsing context

  24. Nested Windows var w = window.self; var w = window.parent;

    var w = window.top; browsing context
  25. DOCSHELL The XPCOM Module

  26. nsIWebNavigation the main interface for a browsing context

  27. nsIWebNavigation / non-e10s

  28. nsIWebNavigation / e10s

  29. nsDocLoader & nsDocShell Tree

  30. DocLoader & DocShell Trees • DocShells are organized as a

    tree, so as DocLoaders. • nsDocShell inherits nsDocLoader. • Multiple docshell trees with different item types can belong to the same docloader tree. • When looking for root docshell, it usually finds same-type root of a subtree. • DocShellTreeOwner points to a root docshell of a subtree.
  31. nsIDocumentLoader / nsDocLoader /** * An nsIDocumentLoader is an interface

    responsible for tracking groups of * loads that belong together (images, external scripts, etc) and subdocuments * (<iframe>, <frame>, etc). It is also responsible for sending * nsIWebProgressListener notifications. * XXXbz this interface should go away, we think... */ [scriptable, uuid(bbe961ee-59e9-42bb-be50-0331979bb79f)] interface nsIDocumentLoader : nsISupports { // Stop all loads in the loadgroup of this docloader void stop(); // XXXbz is this needed? For embedding? What this does is does is not // defined by this interface! readonly attribute nsISupports container; // The loadgroup associated with this docloader readonly attribute nsILoadGroup loadGroup; // The defaultLoadRequest of the loadgroup associated with this docloader readonly attribute nsIChannel documentChannel; };
  32. chrome / non-e10s process Chrome or non-e10s Tree nsDocLoader nsDocLoader

    nsDocLoader nsDocLoader nsDocLoader nsDocLoader nsDocLoader nsDocLoader do_GetService(“@mozilla.org/docloaderservice;1”) nsDocShell nsDocShell nsDocShell nsDocShell nsDocShell nsDocShell nsDocShell chrome tree owner content tree owner
  33. chrome / non-e10s process Chrome or non-e10s Tree nsDocLoader nsDocLoader

    nsDocLoader nsDocLoader nsDocLoader nsDocLoader nsDocLoader nsDocLoader do_GetService(“@mozilla.org/docloaderservice;1”) nsDocShell nsDocShell nsDocShell nsDocShell nsDocShell nsDocShell nsDocShell chrome tree owner content tree owner
  34. Chrome or non-e10s Tree

  35. e10s content process Content Tree in e10s nsDocLoader nsDocShell nsDocShell

    nsDocShell nsDocShell nsDocShell nsDocShell nsDocShell do_GetService(“@mozilla.org/docloaderservice;1”) tab A tree owner tab B tree owner
  36. Content Tree in e10s

  37. DocShell Item Type & Frame Type interface nsIDocShellTreeItem : nsISupports

    { /* Definitions for the item types. */ const long typeChrome=0; const long typeContent=1; const long typeContentWrapper=2; const long typeChromeWrapper=3; const long typeAll=0x7FFFFFFF; /* The type this item is. */ attribute long itemType; … } class DocShell { protected: enum FrameType { eFrameTypeRegular, eFrameTypeBrowser, eFrameTypeApp }; … } Tree traversals are often based on: app or browser boundaries. content / chrome item boundaries. tree owner equality.
  38. DOM Window

  39. Inner / Outer Window Was Ideal Plan

  40. Inner / Outer Window Was Ideal Plan Now

  41. Inner / Outer Window Was Ideal Plan Now

  42. Inner / Outer Window Was Ideal Plan Now

  43. WebIDL Bindings 'Window': { 'nativeType': 'nsGlobalWindow', 'binaryNames': { 'postMessage': 'postMessageMoz',

    }, }, 'WindowProxy': { 'nativeType': 'nsPIDOMWindowOuter', 'headerFile': 'nsPIDOMWindow.h', 'concrete': False }, dom/bindings/Bindings.conf
  44. Relationship with DocShell

  45. Document Init Example

  46. Session History

  47. Session History • Only root docshell holds nsISHistory, which represents

    the session history. • All nsISHEntry of subframes are managed by nsISHistory of the root. • An entry can have children entries, indicate subframes. • When a subframe adds a history entry, the root entry along with all its children are cloned to create a new root entry to the session history.
  48. page1

  49. page1 page2 frame1 page2 frame1

  50. page1 page2 frame1 page2 frame1 frame2

  51. Relationship with DocShell

  52. Recap

  53. “Browser” may refer to browser.xul, <tabbrowser/>, <browser/>, gBrowser nsWebBrowser TabParent

    (nsFrameLoader::mRemoteBrowser) “Window” may refer to The browser window / nsXULWindow / nsWebShellWindow nsIBaseWindow and its parentNativeWindow nsIDOMWindow / mozIDOMWindow / mozIDOMWindowProxy nsPIDOMWindow / nsPIDOMWindowInner / nsPIDOMWindowOuter nsGlobalWindow
  54. The lifetime of inner window associates to the document. The

    lifetime of outer window associates to the browsing context. nsFrameLoader is responsible to Create correct type of nsDocShell or e10s TabParent. Hold the message manager for e10s communication. nsIDocShellTreeOwner is used to Find items. Get notification interface for the nsDocShell tree.
  55. STUDY TIPS

  56. XUL Components browser/base/content/ toolkit/content/widgets/ DocShell / Embedding APIs embedding/browser/ docshell/base/

    uriloader/base/ uriloader/prefetch/ HTML Parser & Elements parser/html/ dom/base/ dom/html/ Cross Platform Front-End / AppShellService xpfe/appshell/ Fennec mobile/android/ widget/android/ mozglue/ Major Source Directories
  57. Print nsIURI in gdb Breakpoint 1, nsDocShell::LoadURI (this=0x7fffd7fd5800, aURI=0x7fffd4886000, aLoadInfo=0x7fffd4829940,

    aLoadFlags=0, aFirstParty=true) at /home/freesamael/Repos/gecko-dev/docshell/base/nsDocShell.cpp:1255 1255 { (gdb) p aURI $1 = (mozilla::SubstitutingURL *) 0x7fffd4886000 (gdb) p aURI->mSpec $2 = {<nsACString_internal> = {mData = 0x7fffd487ab48 "resource://gre-resources/hiddenWindow.html", mLength = 42, mFlags = 5}, <No data fields>} Breakpoint 1, nsDocShell::LoadURI (this=0x7fffd40cc800, aURI=0x7fffd3e04800, aLoadInfo=0x7fffd3e1d310, aLoadFlags=16384, aFirstParty=true) at /home/freesamael/Repos/gecko-dev/docshell/base/nsDocShell.cpp:1255 1255 { (gdb) p aURI $4 = (nsStandardURL *) 0x7fffd3e04800 (gdb) p aURI->mSpec $5 = {<nsACString_internal> = {mData = 0x7fffd3e17fd8 "chrome://browser/content/browser.xul", mLength = 36, mFlags = 5}, <No data fields>}
  58. Print nsIURI in gdb Breakpoint 1, nsDocShell::LoadURI (this=0x7fffc9904800, aURI=0x7fffc993a980, aLoadInfo=0x7fffc625ee50,

    aLoadFlags=0, aFirstParty=false) at /home/freesamael/Repos/gecko-dev/docshell/base/nsDocShell.cpp:1255 1255 { (gdb) p aURI $8 = (nsNestedAboutURI *) 0x7fffc993a980 (gdb) p ((nsIURI*)aURI->mInnerURI) $9 = (nsSimpleURI *) 0x7fffc993c500 (gdb) p *((nsIURI*)aURI->mInnerURI) $10 = (nsSimpleURI) {<nsIURI> = {…, mScheme = {<nsACString_internal> = {mData = 0x7fffc99376e8 "moz-safe-about", mLength = 14, mFlags = 5}, <No data fields>}, mPath = {<nsACString_internal> = {mData = 0x7fffc9927e38 "blank", mLength = 5, mFlags = 5}, <No data fields>}, mRef = {<nsACString_internal> = { mData = 0x7fffeb86d140 <gNullChar> "", mLength = 0, mFlags = 1}, <No data fields>}, mMutable = false, mIsRefValid = false}
  59. Resource Hints Concept credit: https://docs.google.com/presentation/d/ 18zlAdKAxnc51y_kj-6sWLmnjl6TLnaru_WH0LJTjP-o

  60. Test Prerendering • Websites to test prefetching / prerendering •

    http://stevesouders.com/tests/prebrowsing/ • http://prerender-test.appspot.com/ • http://chris.improbable.org/experiments/browser/prefetch-timing.html • Observe Chrome’s prerendering tasks • chrome://net-internals/#prerender
  61. 法 喜 充 滿 認 同 請 分 享