blink的SpatialNavigationEnabled会引起刷新区域过大

blink里的setting,有个SpatialNavigation,设置为true的话,在

EventHandler::handleMouseFocus -》 element->isMouseFocusable()里会判断这个settings,

> miniblink.dll!blink::ElementRuleCollector::collectMatchingRules
  miniblink.dll!blink::StyleResolver::matchRuleSet
  miniblink.dll!blink::StyleResolver::matchUARules
  miniblink.dll!blink::StyleResolver::matchAllRules
  miniblink.dll!blink::StyleResolver::styleForElement
  miniblink.dll!blink::Element::originalStyleForLayoutObject
  miniblink.dll!blink::Element::styleForLayoutObject
  miniblink.dll!blink::Element::recalcOwnStyle
  miniblink.dll!blink::Element::recalcStyle
  miniblink.dll!blink::ContainerNode::recalc
  miniblink.dll!blink::Element::recalcStyle
  miniblink.dll!blink::ContainerNode::recalcChildStyle
  miniblink.dll!blink::Element::recalcStyle
  miniblink.dll!blink::ContainerNode::recalcChildStyle
  miniblink.dll!blink::Element::recalcStyle
  miniblink.dll!blink::ContainerNode::recalcChildStyle
  miniblink.dll!blink::Element::recalcStyle
  miniblink.dll!blink::ContainerNode::recalcChildStyle
  miniblink.dll!blink::Element::recalcStyle
  miniblink.dll!blink::ContainerNode::recalcChildStyle
  miniblink.dll!blink::Element::recalcStyle
  miniblink.dll!blink::Document::updateStyle
  miniblink.dll!blink::Document::updateLayoutTree
  miniblink.dll!blink::Document::updateLayoutTreeIfNeeded()
  miniblink.dll!blink::Document::setFocusedElement
  miniblink.dll!blink::FocusController::setFocusedElement
  miniblink.dll!blink::EventHandler::handleMouseFocus

这样,如果SpatialNavigationEnabled为true,大部分元素都拥有了focusable的能力。而blink的默认样式有一句

:focus {
    outline: auto 5px -webkit-focus-ring-color
}

所以会让元素拥有一个焦点框。

而焦点框会在LayoutObject::paintInvalidationReason里,

走到这句

    if (styleRef().outlineStyleIsAuto())
        return PaintInvalidationFocusRing;

返回一个

PaintInvalidationFocusRing

的刷新原因。

这个会导致整个layer被刷新。

如果网页很长,或者div很长的话,这个刷新有可能是全屏的。代价非常大。

搜了下这个settings,是为无障碍化设计的,貌似是用键盘上下左右键来控制焦点转移的。一般是默认关闭状态。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

扫码关注云+社区

领取腾讯云代金券