디지털 장인정신

블로그 이미지
WebKit개발자의 혼자쓰는 블로그
스페로

Article Category

All (71)
Technology (47)
Creativity (19)
Private (4)

Recent Comment

Recent Trackback

Calendar

«   2018/12   »
            1
2 3 4 5 6 7 8
9 10 11 12 13 14 15
16 17 18 19 20 21 22
23 24 25 26 27 28 29
30 31          

Archive

My Link

  • Total339,104
  • Today15
  • Yesterday243
  1. 2012.12.11
    High-DPI and viewport and sub pixel layout (2)
  2. 2012.10.23
    WebKit css3 animations on Accelerated Compositing (1)
  3. 2012.10.20
    WebKit Filters Animation Internal (1)
  4. 2011.02.16
    WebKit Chromium Build in Ubuntu 10.10 64bit
  5. 2011.01.31
    QT WebKit Windows에서 빌드
  6. 2010.10.18
    WebKit에서 새창띄우기 function flow
  7. 2010.10.12
    WebKit TiledBackingStore Drawing Sequence 분석
  8. 2010.10.04
    WebCore의 event 처리 루틴

에플 레티나 디스플레이 때문에 요즘 웹킷 그래픽스 folk들 사이에서는 HDPI지원을 위한 패치들이 한참이다.

관련된 주제들은 다음과 같다.


1. SubPixel layout

http://trac.webkit.org/wiki/LayoutUnit

http://trac.webkit.org/changeset/116009


2. SubPixel font rendering

https://docs.google.com/document/d/1wpzgGMqXgit6FBVaO76epnnFC_rQPdVKswrDQWyqO1M/edit#heading=h.bjsw53t8jqke


3. DEVICEPIXELRATIO & Viewport

http://www.html5rocks.com/en/tutorials/canvas/hidpi/

http://www.html5rocks.com/en/mobile/high-dpi/

http://www.quirksmode.org/blog/archives/2012/06/devicepixelrati.html

http://www.quirksmode.org/blog/archives/2012/07/more_about_devi.html

http://developer.apple.com/library/safari/#documentation/AppleApplications/Reference/SafariWebContent/UsingtheViewport/UsingtheViewport.html

http://developer.apple.com/library/safari/#documentation/NetworkingInternet/Conceptual/SafariImageDeliveryBestPractices/Introduction/Introduction.html

http://developer.android.com/guide/webapps/targeting.html


패치는 커녕 follow-up만으로도 힘이 붙인다.

'Technology > Webkit' 카테고리의 다른 글

Profiling WebKit with Perf  (1) 2012.12.12
High-DPI and viewport and sub pixel layout  (2) 2012.12.11
WebKit css3 animations on Accelerated Compositing  (1) 2012.10.23
WebKit Filters Animation Internal  (1) 2012.10.20
WebKit2 Injected Bundle  (1) 2012.10.15
oprofile  (2) 2012.06.02
Trackback 0 and Comment 2

우선 WebCore의 animation의 구조부터 보자


1. AnimationController

- timer로 animation loop를 돌린다.

- Map<renderer, CompositeAnimation>으로 document의 모든 animation을 관리한다.


2. CompositeAnimation

- Map<name, KeyframeAnimation> 혹은 Map<int, ImplicitAnimation>으로 animation들을 관리한다. 하나의 renderer가 여러 keyframe&transition animation의 적용을 받을수 있기 때문이다.


3. AnimationBase

- RefPtr<Animation> : name, TimingFunction, delay, duration, iterCount 등을 관리


4. KeyframeAnimation extends AnimationBase

-  KeyframeList : keyframe당 style들을 저장. animation하는 CSSPropertyID들도 저장

- RenderStyle : animation되기 전의 style. animation시 keyframe당 style을 이 객체로 부터 복사해서 만든다.

Software path에서는 KeyframeAnimation::animate 메소드로 animation을 blend한다. 그럼 무려 RenderStyle로 blend를 하는 비효율을 보여준다.

AC path에서는 GraphicsLayer.h에 정의되어있는 KeyframeValueList 로 blend를 한다. 아주 효율적이다.

KeyframeValueList는 RenderLayerBacking::startAnimation에서 KeyframeList로부터 만들어낸다. 즉 각 platform GraphicsLayer는 RenderStyle과 관련없는 animation의 정수만 뽑아낸 KeyframeValueList를 받아 알아서 animation을 진행한다.

그럼 transition은 AC에서 어떻게 처리할까? RenderLayerBacking::startTransition이 transition을 keyframe animation처럼 KeyframeValueList 만들어서 GraphicsLayer에 넘겨준다.

즉 AC입장에서는 keyframe animation과 transition의 처리 루틴이 같다.

'Technology > Webkit' 카테고리의 다른 글

Profiling WebKit with Perf  (1) 2012.12.12
High-DPI and viewport and sub pixel layout  (2) 2012.12.11
WebKit css3 animations on Accelerated Compositing  (1) 2012.10.23
WebKit Filters Animation Internal  (1) 2012.10.20
WebKit2 Injected Bundle  (1) 2012.10.15
oprofile  (2) 2012.06.02
Trackback 0 and Comment 1

I investigated when enabling Accelerated Compositing. However, process is the same to software path until RenderLayer::styleChanged() in 3. Notify filters changed.


1. Animation loop : loop using timer in AnimationControllerPrivate

FrameView::serviceScriptedAnimations() <- request animation frame callback

AnimationController::serviceAnimations()

AnimationControllerPrivate::animationFrameCallbackFired()

AnimationControllerPrivate::animationTimerFired()

AnimationControllerPrivate::updateAnimationTimer()

1) m_animationTimer.startRepeating() if needed: creating loop

AnimationControllerPrivate::updateAnimations()

Document::updateStyleIfNeeded()

void RenderObject::setAnimatableStyle(PassRefPtr<RenderStyle> style)

{

    if (!isText() && style)

        setStyle(animation()->updateAnimations(this, style.get()));

    else

        setStyle(style);

}

1) Blend FilterOperation

2) Notify filters changed


2. Blend FilterOperation : Create FilterOperations per frame.

AnimationController::updateAnimations()

CompositeAnimation::animate()

KeyframeAnimation::animate()

CSSPropertyAnimation::blendProperties()

PropertyWrapperAcceleratedFilter::blend()

BasicColorMatrixFilterOperation::blend()


3. Notify filters changed : notify FilterOperations changed to RenderLayer

RenderObject::setStyle()

RenderLayerModelObject::styleDidChange()

RenderLayer::styleChanged()

4) ensure backing if needed

5) notify flush


4. ensure backing if needed : create RenderLayerBacking at the first time.

RenderLayerCompositor::updateLayerCompositingState()

RenderLayerCompositor::updateBacking()

RenderLayer::ensureBacking()


5. notify flush : notify FilterOperations changed to GraphicsLayer

RenderLayerBacking::updateGraphicsLayerGeometry()

RenderLayerBacking::updateFilters()

GraphicsLayerTextureMapper::setFilters()

LayerTreeCoordinator[AcceleratedCompositingContext]::scheduleLayerFlush()

'Technology > Webkit' 카테고리의 다른 글

High-DPI and viewport and sub pixel layout  (2) 2012.12.11
WebKit css3 animations on Accelerated Compositing  (1) 2012.10.23
WebKit Filters Animation Internal  (1) 2012.10.20
WebKit2 Injected Bundle  (1) 2012.10.15
oprofile  (2) 2012.06.02
massif 메모리 사용량을 측정하자  (0) 2012.05.31
Trackback 1 and Comment 1
sudo apt-get install bison fakeroot flex g++ g++-multilib gperf \
  libapache2
-mod-php5 libasound2-dev libbz2-dev libcairo2-dev \
  libdbus
-glib-1-dev libgconf2-dev libgl1-mesa-dev libglu1-mesa-dev \
  libglib2
.0-dev libgtk2.0-dev libjpeg8-dev libnspr4-dev libnss3-dev \
  libpam0g
-dev libsqlite3-dev libxslt1-dev libxss-dev \
  mesa
-common-dev ttf-mscorefonts-installer patch perl pkg-config python \
  python2
.6-dev rpm subversion libcups2-dev libgnome-keyring-dev \
  libcurl4
-gnutls-dev libxtst-dev
만약 그냥 디버깅만 하고 싶은거라면
 http://build.chromium.org/f/chromium/snapshots/

'Technology > Working Note' 카테고리의 다른 글

Quick Reference Cards  (0) 2011.02.26
Unicode  (0) 2011.02.23
WebKit Chromium Build in Ubuntu 10.10 64bit  (0) 2011.02.16
JNI inside  (0) 2011.02.12
Garbage collector  (0) 2011.02.12
QT WebKit Windows에서 빌드  (0) 2011.01.31
Trackback 0 and Comment 0
http://blog.paran.com/blog/detail/postBoard.kth?pmcId=breadval&blogDataId=38171882&hrefMark=

'Technology > Working Note' 카테고리의 다른 글

JNI inside  (0) 2011.02.12
Garbage collector  (0) 2011.02.12
QT WebKit Windows에서 빌드  (0) 2011.01.31
IDE 자주쓰는 단축키  (0) 2010.11.26
좋은 기술 문서 링크 페이지  (0) 2010.11.25
라이브러리 만들기  (0) 2010.11.22
Trackback 0 and Comment 0
1. window.open
  • JSDOMWindowCustom::open
    • top or parent일때 처리
    • DOMWindow::adjustWindowRect
    • JSDOMWindowCustom::createWindow
      • FrameLoader::createWindow
        • ChromeClientImpl::createWindow
          • WebViewAlticast::createWindow
        • ChromeClientImpl::setWindowRect
        • ChromeClientImpl::show
      • FrameLoader::setOpener
      • Page::setOpenedByDOM
      • JSDOMWindow::putDirect <- 뭔가 window에 대한 처리??
      • FrameLoader::changeLocation
        • FrameLoader::urlSelected
          • FrameLoader::loadFrameRequest
            • FrameLoader::loadURL
              • FrameLoader::loadWithNavigationAction

2. <a href='' target=''>
  • HTMLAnchorElement::defaultEventHandler
    • FrameLoader::urlSelected
      <- urlSelected(document()->completeURL(url), getAttribute(targetAttr), evt, false, false, true, hasRel(RelationNoReferrer) ? NoReferrer : SendRef    errer);
      • FrameLoader::loadFrameRequest
        • FrameLoader::loadURL
          • PolicyChecker::checkNewWindowPolicy
            • FrameLoaderClientImpl::dispatchDecidePolicyForNewWindowAction
              • PolicyChecker::continueAfterNewWindowPolicy
          • FrameLoader::callContinuLoadAfterNewWindowPolicy <- blank or 'id'
            • FrameLoader::continueLoadAfterNewWindowPolicy
              • FrameLoaderClientImpl::dispatchCreatePage
                • ChromeClientImpl::createWindow <- 뭔가 window에 대한 처리??
                  • WebViewAlticast::createWindow
              • Page::setOpenedByDOM
              • FrameLoaderClinetImpl::dispatchShow  <- not Implemented
              • FrameLoader::setOpener
              • FrameLoader::loadWithNavigationAction
          • FrameLoader::loadWithNavigationAction <- self & top & parent etc..




'Technology > Working Note' 카테고리의 다른 글

좋은 기술 문서 링크 페이지  (0) 2010.11.25
라이브러리 만들기  (0) 2010.11.22
WebKit에서 새창띄우기 function flow  (0) 2010.10.18
WebKit TiledBackingStore Drawing Sequence 분석  (0) 2010.10.12
JAVA Server 만들기  (0) 2010.10.05
WebCore의 event 처리 루틴  (0) 2010.10.04
Trackback 0 and Comment 0


  • FrameView::repaintContentRectangle

  • FrameView::layout()
    • Document::updateSytleIfNeeded
    • RenderLayer::layout()
    • FrameView::adjustViewSize()
    • FrameView::setContentsSize
      • ScrollView::setContentsSize
      • WebFrameImpl::contentsSizeChanged
        • TiledBackingStore::adjustVisibleRect
          • TiledBackingStore::startTileCreationTimer
            • TiledBackingStore::createTiles()
              • Tile::create
              • TiledBackingStore::updateTileBuffers <- 새로만든 Tile 그림그리기
              • TiledBackingStore::startTileCreationTimer <- 더 만들것이 남았으면
    • FrameView::endDeferredRepaints()
      • FrameView::doDeferredRepaints()
        • TiledBackingStore::invalidate



  • TiledBackingStore::updateTileBuffers()
    • Frame::tiledBackingStorePaintBegin()
      • FrameView::updateLayoutAndStyleIfNeededRecursive()
      • FrameView::doDeferredRepaints()
        • TiledBackingStore::invalidate
          • TileSkia::invalidate
          • TiledBackingStore::startTileBufferUpdateTimer()
            • TiledBackingStore::updateTileBuffer() <- Timer에 의해 불림
    • TileSkia::updateBackBuffer() <- 실제로 SkBitmap을 셋팅하고 RenderTree를 traverse하며 그림을 그리는 시작점
      • Frame::tiledBackingStorePaint
        • FrameView::paintContents
          • RenderLayer::paint
            • RenderObject::paint
    • TileSkia::swapBackBufferToFront()
    • Frame::TiledBackingStorePaintEnd
      • ChromeClientImpl::invalidateContentsAndWindow
        • SkView::inval <- 조금후에 dirty Rect를 모아 SkView::onDraw 콜
  • WebViewImpl::onDraw <- SkView::onDraw overloading
    • TiledBackingStore::paint
      • TileSkia::paint
        • SkCanvas::drawBitmapRect

'Technology > Working Note' 카테고리의 다른 글

라이브러리 만들기  (0) 2010.11.22
WebKit에서 새창띄우기 function flow  (0) 2010.10.18
WebKit TiledBackingStore Drawing Sequence 분석  (0) 2010.10.12
JAVA Server 만들기  (0) 2010.10.05
WebCore의 event 처리 루틴  (0) 2010.10.04
자주쓰는 git 명령어  (0) 2010.04.23
Trackback 0 and Comment 0
WebViewImpl::onEvent() <- WebView::onEvent()의 구현
EventHandler::keyEvent() or mouseEvent()
Node::defaultXXXEventHandler()
Node::defaultEventHandler()
HTMLXXXXElement::defaultEventHandler()

분기가 너무복잡해서 언제 event type이 나뉘어서 적절히 분배되는지 명확히 분석이 힘들다.

분기의 예>
  • Node::defaultEventHandler()
    • Button, Image, Submit 등의 input이 있는 tag node라면
  • HTMLInputElement::defaultEventHandler()
    • 만약 type = keypress && charcode = '\r' 이라면
    • mouseClick으로 event변신
  • Node -> HTMLInputElement 로 다시 type = click인것으로 위장하여 들어옴. 

'Technology > Working Note' 카테고리의 다른 글

WebKit에서 새창띄우기 function flow  (0) 2010.10.18
WebKit TiledBackingStore Drawing Sequence 분석  (0) 2010.10.12
JAVA Server 만들기  (0) 2010.10.05
WebCore의 event 처리 루틴  (0) 2010.10.04
자주쓰는 git 명령어  (0) 2010.04.23
Tech Log  (0) 2010.04.10
Trackback 0 and Comment 0