.getBoundingClientRect() or lightweight alternative?

[Emilio Cobos Álvarez]

I'm posting this message in the name of Rod McGuire, who got his message
rejected apparently.

---

[ I apologize for knowing nothing of current Servo internals ]

For precise layout of things like math equations or SVG diagrams a
Javascrpt application may need to know the width and height extent of
component elements.

Currently in browsers the only way to find this information is with
.getBoundingClientRect() which only works after an element has been
rendered and also returns x and y position information.

The current way to kludge around this is by rendering each element
twice - on the first pass width and height information is collected
to determine the layout in the final render pass.

[ MathJax does this though I think they are moving towards an
external font table approach ]

I've heard that to just get width and height information without
rendering would require a major rewrite of the work flow for most
current browsers.

Has there been any effort in Servo to make available this information
for non-rendered elements?

I think most developers affected by this would be somewhat happy with
width and height just for textual elements. They also might like some
exposure of the actual selected font so that font table information can
be used in layout.

I haven't been able to find any discussion of this issue though there
seems to be some on performance of the full blown
.getBoundingClientRect().

[1]: https://developer.mozilla.org/en-US/docs/Web/API/Element/getBoundingClientRect
[2]: Recent Improvements to Functions like getClientBoundingRect - https://groups.google.com/forum/#!searchin/mozilla.dev.servo/getBoundingClientRect/mozilla.dev.servo/fpY49KCQ_64/0Mq7fnn4OMIJ

[Michael Howell]

To compute the bounding box of an element, you have to place it in the DOM,
because you can't do CSS selector matching on an element otherwise. You
have to do selector matching on it to know which CSS rules will be
applicable, because CSS rules affect the bounding box.

We defer the actual rendering process as much as possible, so if you're
doing a bunch of DOM operations just to compute bounding boxes we'll do
layout a lot but won't actually render it until your script returns control
to the event loop. Don't all the major browsers do that, though?

On Sat, Nov 12, 2016, 9:50 AM Emilio Cobos Álvarez <eco...@gmail.com>
wrote:

> _______________________________________________
> dev-servo mailing list
> dev-...@lists.mozilla.org
> https://lists.mozilla.org/listinfo/dev-servo
>

[Simon Sapin]

On 12/11/16 17:49, Emilio Cobos Álvarez wrote:
> I think most developers affected by this would be somewhat happy with
> width and height just for textual elements. They also might like some
> exposure of the actual selected font so that font table information can
> be used in layout.

There is a proposed Font Metrics API that does this:
https://drafts.css-houdini.org/font-metrics-api/

It is still in early exploratory stages. Please send feedback on this
API as indicated near the top of the draft.

--
Simon Sapin