There are many Lottie plugins for Gutenberg editor, but Greenshift has many useful extra options. First of all, it has smart loader, so it’s loading only after user has interactions, this allows to have perfect web vitals score even on heavy animations. Just check this page and you will see results.
Also, it has screenshot maker, so you can easily capture fallback image
Also, Lottie module has interaction possibilities, for example, you can make lottie playing based on user scroll
And on Hover effects. Hover over image
Additionally, plugin has also DotLottie block if you prefer to use lightweight .lottie format
<!-- wp:paragraph -->
<p>There are many Lottie plugins for Gutenberg editor, but Greenshift has many useful extra options. First of all, it has smart loader, so it's loading only after user has interactions, this allows to have perfect web vitals score even on heavy animations. Just check this page and you will see results.</p>
<!-- /wp:paragraph -->
<!-- wp:paragraph -->
<p>Also, it has screenshot maker, so you can easily capture fallback image</p>
<!-- /wp:paragraph -->
<!-- wp:greenshift-blocks/lottie {"disablelazy":false,"imageid":835,"imageurl":"https://greenshiftwp.com/wp-content/uploads/2022/05/download_0.4761904761904762.svg","width":[600,null,null,null],"height":[500,null,null,null],"id":"gsbp-8e2312b5-57c0"} -->
<div class="wp-block-greenshift-blocks-lottie gs-lottieloader gs-lottie-gsbp-8e2312b5-57c0" style="display:flex;justify-content:center"><lottie-player id="gs-lottie-gsbp-8e2312b5-57c0" src="https://assets4.lottiefiles.com/private_files/lf30_nlhswxdd.json" background="#ffffff00" speed="1" style="width:600px;height:500px" loop autoplay data-visibility-start="0.1" data-visibility-end="1" data-frames-start="" data-frames-end="100" data-modetype="hover" data-interactivity=""></lottie-player><img src="https://greenshiftwp.com/wp-content/uploads/2022/05/download_0.4761904761904762.svg" alt="" width="600px" height="500px" style="pointer-events:none"/></div>
<!-- /wp:greenshift-blocks/lottie -->
<!-- wp:paragraph -->
<p>Also, Lottie module has interaction possibilities, for example, you can make lottie playing based on user scroll</p>
<!-- /wp:paragraph -->
<!-- wp:greenshift-blocks/lottie {"source":"https://assets8.lottiefiles.com/packages/lf20_mbe3iiji.json","mode":"scroll","modetypescroll":"seek","width":[500,null,null,null],"height":[500,null,null,null],"frameEnd":120,"id":"gsbp-f86bd697-3501"} -->
<div class="wp-block-greenshift-blocks-lottie gs-lottieloader gs-lottie-gsbp-f86bd697-3501" style="display:flex;justify-content:center"><lottie-player id="gs-lottie-gsbp-f86bd697-3501" src="https://assets8.lottiefiles.com/packages/lf20_mbe3iiji.json" background="#ffffff00" speed="1" style="width:500px;height:500px" data-visibility-start="0.1" data-visibility-end="1" data-frames-start="" data-frames-end="120" data-modetype="seek" data-interactivity="scroll"></lottie-player></div>
<!-- /wp:greenshift-blocks/lottie -->
<!-- wp:paragraph -->
<p>And on Hover effects. Hover over image</p>
<!-- /wp:paragraph -->
<!-- wp:greenshift-blocks/lottie {"source":"https://assets2.lottiefiles.com/packages/lf20_l3awcbpv.json","mode":"cursor","modetypecursor":"hold","id":"gsbp-32a15d21-4cd3"} -->
<div class="wp-block-greenshift-blocks-lottie gs-lottieloader gs-lottie-gsbp-32a15d21-4cd3" style="display:flex;justify-content:center"><lottie-player id="gs-lottie-gsbp-32a15d21-4cd3" src="https://assets2.lottiefiles.com/packages/lf20_l3awcbpv.json" background="#ffffff00" speed="1" style="width:300px;height:300px" data-visibility-start="0.1" data-visibility-end="1" data-frames-start="" data-frames-end="100" data-modetype="hold" data-interactivity="cursor"></lottie-player></div>
<!-- /wp:greenshift-blocks/lottie -->
<!-- wp:paragraph -->
<p>Additionally, plugin has also DotLottie block if you prefer to use lightweight .lottie format</p>
<!-- /wp:paragraph -->
