Yes this technique also works for Vimeo iframes, but I still found Vimeo embeds affecting Lighthouse performance results quite hard (about 30% on mobile).
There are a couple of reasons for this: Their player.js and the vimeo iframe itself, loads yet more scripts and css that delays the page rendering.
I've got a couple of little tricks to fix this.
-
Vimeo uses their own player.js. You can load this once instead and force it to defer or async the script and remove it from any embed pastes.
-
Vimeo added a defer technique for their iframe scripts and CSS you can enable.
It is well documented for javascript embeds, but not for iframes — however I tested the code it output and found that adding the following attribute to your vimeo iframe attribute enables the same defer feature in iframe embeds.
data-vimeo-defer
Here is an example:
<iframe loading="lazy" data-vimeo-defer src="https://player.vimeo.com/video/148751763?badge=0&autopause=0&player_id=0&app_id=58479" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen title="You'll never guess what this video is!" ></iframe>
With this added, everything Vimeo does is deferred or asynchronous and no longer blocks page rendering. I've got my mobile and desktop scores to 96% and 100% after fixing Vimeo.