davidjbradshaw / iframe-resizer-react

The official React interface for Iframe-Resizer

Home Page:https://iframe-resizer.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

slow/flashing resizing animation

rossjs opened this issue · comments

When resizing the page, the content resizes very slowly/awkwardly and makes some components flash repeatedly.

Here's a video showcasing what I'm describing

Working out the height of the page can be expensive, this is not really designed with animation in mind. You might try some of the different height calculation methods. Some are a lot faster than others. Also look at the performance of your animation. Are you doing it by JS or CSS?

Oh, I'm not actually doing any animation myself. I only used that term since it's used in the logs that the library outputs (when the logs property is set to true).

I ran into this same issue when I built my own implementation of a dynamically resizing iframe for same-origin static pages, but solved it by tweaking a few things. Not sure if my solution to the problem would be insightful here or not since I don't completely understand postMessage or how the child content within the iframe is communicating back to the parent, but I've linked a gist below with the code I used in my implementation.

DynamicInlineFrame React component