WebKit/EFL & WebKit2/EFL
WebKit/EFL & WebKit2/EFL
WebKit/EFL & WebKit2/EFL
- No tags were found...
Create successful ePaper yourself
Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.
<strong>WebKit</strong>/<strong>EFL</strong> & <strong>WebKit</strong>2/<strong>EFL</strong>Ming Jin, Samsung Electronics(May 9, 2012)
Contents• What Really Matters– Standards, Functionality, Performance• <strong>WebKit</strong>/<strong>EFL</strong> Internals– HTML5, UI Responsiveness, 2D/3D Graphics, etc.• <strong>WebKit</strong>2/<strong>EFL</strong> Internals– Accelerated Composition, Rendering Flow, etc.2tizen.org
Web Applications on Tizen PlatformInteractionNetworkingDevice Resources3tizen.org
What Really MattersFunctionalityPerformance1 HTML5 / W3C Specs2 UI Responsiveness3 2D/3D Graphics4 JavaScript EngineStandard Compliance4tizen.org
HTML5 Support Status1<strong>WebKit</strong><strong>WebKit</strong>25tizen.org
UI Responsiveness2ScrollPerformanceTouchResponse<strong>WebKit</strong>2<strong>WebKit</strong><strong>WebKit</strong><strong>WebKit</strong>26tizen.org
2D/3D Graphics3Cairo /GLESCairo /GLESCairo /PixmanCanvasPerfBenchmark Score7tizen.org
JavaScript Engine4<strong>WebKit</strong><strong>WebKit</strong>2SunspiderBenchmark8tizen.org
<strong>WebKit</strong>/<strong>EFL</strong>
Overall Architecture & FocusBrowserWeb RuntimeWeb UI FrameworkHTML5HTML5Tizen Web APIjQuery MobileWebView<strong>WebKit</strong> APIWebCoreSupportBackingStoreJavaScriptCore(SFX)42WebCorePlatform PortPlatform Port13Graphics PortNetwork PortTizen Native PlatformFWsUI FWMultimedia FW Messaging FW System FW … <strong>EFL</strong>OpenGLESCairoX11Linux Kernel10tizen.org
HTML5 Implementation1BrowserFile Reader APIWebViewJSCore(SFX)WebCoreJSEngineBinderFile APILoaderNetworkPlaform PortFile portPOSIX Qt MacWinWeb Socket Web GL Geolocation API Web Worker File System Vibration …11tizen.org
Rendering Flow OverviewBrowserURL Bar<strong>WebKit</strong> APIWebViewWebCoreSupportTool BarJavaScriptCore(SFX)WebCoreBacking-storeGraphics PortPlatform PortNetwork PortUI FWEvasCairolibsoupX ServerOpenGL ES / EGLTextureURL BarEvasTool BarWindow BufferBrowser IndicatorFrameBuffer12tizen.org
Backing-store: Rendering Flow2title bartool barBackingStoreWebViewGraphicsContextBrowserCairoEvasX ServerCompositorGLES / EGLevas canvas(output)window bufferframe bufferTexturefor title barTexturefor tool barTextures for evas objectsin BackingStorebrowserindicator13tizen.org
Backing-store: Panning2• No update is called when the tiles around the viewport havealready been renderedScroll by (-10,-10)0,0 0,1 0,21,0 1,1 1,22,0 2,1 2,20,31,32,3Add tiles to be displayed in viewportas scrolling tiles3,0 3,1 3,2 3,3Move (x,y) of each scrolling tileby scroll distance (-10, -10) :evas_object_move()Update evasScroll by (-10, -10)0,0 0,1 0,21,0 1,1 1,22,0 2,1 2,23,0 3,1 3,20,31,32,33,30,11,12,10,21,22,20,31,32,33,1 3,2 3,3Tiles to be displayed in viewport14tizen.org
Accelerated Composition3• When contents property is changed dynamically– Change position, rotation & size of the layer– Execute compositing only No repainting15tizen.org
2D/3D Graphics3<strong>WebKit</strong>Graphics PortPixmanbackendCairoOpen GLESbackendPixmanOpen GLES16tizen.org
DFG JIT4CompileTimeBase JITC : Running TimeDFG JITC : Compile Time Running TimeConduct Base JITCat the beginningInvoke DFG JITC when Hotspots are identifiedHigher quality codesCompileFoo()RunFoo()CompileGoo()RunGoo()RunFoo()RunFoo()RecompileFoo()RunFoo()RunFoo()……SequenceJavaScriptCoreNowOn The RoadmapExecutableJSParserbytecodegeneratorBase JIT17tizen.org
<strong>WebKit</strong>2/<strong>EFL</strong>
<strong>WebKit</strong> vs. <strong>WebKit</strong>2<strong>WebKit</strong><strong>WebKit</strong>2Process model Single Process Multi ProcessAPI type Blocking API Non-blocking API<strong>WebKit</strong>UI ProcessApplicationAPI<strong>WebKit</strong><strong>WebKit</strong>2UI ProcessApplicationAPI<strong>WebKit</strong> (UI Process)Function callIPC<strong>WebKit</strong> (Web Process)ProcessBoundaryWebCoreJS EngineWebCoreJS EngineWeb Process19tizen.org
CoreIPC<strong>WebKit</strong>2/<strong>EFL</strong> Based Browser ArchitectureBrowser<strong>WebKit</strong>2-UIProcess<strong>WebKit</strong>2-WebProcessWebPageWebCoreSupportEvas ObjectCoreIPCJavaScriptCore(SFX)DrawingAreaWebCorePlatform PortGraphics PortNetworkPortUI FWEvasUI FWCairolibsoupX ServerOpenGL ES / EGLTitle BarTool BarEvas CanvasWebViewWindow BufferBrowser IndicatorFrame Buffer20tizen.org
CoreIPCJob Distribution across Processes1 2 3 4 5Resource Loading ParsingLayout JS ExecutionPainting6UI UpdateBrowser<strong>WebKit</strong>2-WebProcessTitle BarUIProcessWebPageWebCoreSupportTool Bar6UI UpdateEvas ObjectCoreIPC4JavaScriptCoreJS Execution (SFX)DrawingArea35LayoutPaintingWebCore2ParsingPlatform PortGraphics Port1Resource LoadingNetworkPortBenefitSensitive touch response in UIProcessFrequent display update in UIProcess: 2-stage pipeline of 1~5 and 621tizen.org
<strong>WebKit</strong>2 Tiled Accelerated Composition2Web Graphics LayerGraphics Layer TreerootGL4GL1GL3GL2GL3GL4GL2GL1Non-compositing LayerGraphicsLayerAreaTile22tizen.org
CoreIPCwww.css3-polaroidswww.css3-polaroids<strong>WebKit</strong>2 Tiled AC: Rendering Flow2BrowserUIProcessWebProcessEvasObjectWebPageProxyDrawingAreaProxyCoreIPCsyncDrawingAreaTiledBackingStoreWebCorePlatform PortJavaScriptCoreShared MemoryUI FWCairoEvasX ServerOpenGL ES / EGL23Backing StoreEvasTitle BarURL BarTool BarWindow BufferBrowsercss3-polaroidsIndicatortizen.orgcss3-polaroidsFrameBuffer
Painting Thread2WebProcessmain threadWebProcesspaint threadUIProcess5-1 5-2RecordingPainting OperationsReplayingPainting Operations6UI UpdateRecordingSurfacesBacking StoreCairo Recording Surface Painting Thread SeparationOperation Cost: Recording
Thank You.
Change language