search

marcj / css-element-queries

CSS Element-Queries aka Container Queries. High-speed element dimension/media queries in valid css.
http://marcj.github.io/css-element-queries/
MIT License
4.27k stars 487 forks source link

Use resizeobserver when available #213

Closed movedoa closed 6 years ago

movedoa commented 6 years ago

This fixes #210 and #184 by using resizeobserver when available (afaik only chrome 64+ supports this at the moment)

The native resizeobserver is way faster than the current implementation. This pr is based on #212

marcj commented 6 years ago

Cool, can you pls remove that tabs?

movedoa commented 6 years ago

Done

marcj commented 6 years ago

Just saw that you included the commit of https://github.com/marcj/css-element-queries/pull/208, that should really not be part of this PR.

movedoa commented 6 years ago

The problem is that this includes #212 which needs #208 to work, so i am not shure what to do now I can change this pr to be standalone but I can't do the same for #212

marcj commented 6 years ago

Alright, then lets keep it simple and keep it. We close then both other PRs when this is merged. Please adjust then the requested changes that were coming in from the other PRs. :)

movedoa commented 6 years ago

I hope i got everything ;-)

marcj commented 6 years ago

Looks very good, thank you very much! : )

rayshan commented 6 years ago

Thanks all, this is huge! Can we cut a new release with ResizeObserver?

marcj commented 5 years ago

This has been reverted in https://github.com/marcj/css-element-queries/commit/45334e9f36ede5e037d2749ff398daa20dc5ae22 due to errors

teuf22 commented 5 years ago

Just curious: what kind of errors ? I had been using this patch with no problems so far. Thank you!

marcj commented 5 years ago

This line broke since the ResizeObserver does not inject a new HTML element as property called resizeSensor to element, https://github.com/marcj/css-element-queries/blob/45334e9f36ede5e037d2749ff398daa20dc5ae22/src/ElementQueries.js#L421