HTML 要素を非表示にした後に生まれるスペースのを削除し、要素を詰めて表示する

実現したいこと

前提

JavaScript で Firefox 向けの拡張機能を以下のリポジトリで作成しています。
https://github.com/2clchino/tube_remover
YouTube AI におすすめされた興味のない動画を、特定の条件に基づいて非表示にするような拡張機能です。
非表示にする機能は実装済みです。

発生している問題・エラーメッセージ

非表示にした後その動画があった場所に空白のスペースができてしまいます。
前述の GitHub リポジトリの README にその様子をスクリーンショットで添付しています。
この空白のスペースを削除したいです。

該当のソースコード

現在は下記のように style を "hidden" に変更して非表示にしています。
ソースコード全体は こちら より確認できます。

javascript

1if (filterByViewCount(viewCnt)) {2 console.log(chName[0].textContent);3 if (chName.length > 0) {4 let element = chName[0]5 if (!subscribedChannels.includes(element.textContent)) {6 remove = true;7 console.log(element.textContent);8 if (!removed.includes(element.textContent)) {9 removed.push(element.textContent);10 }11 }12 }13}14meta_blks[i].style.visibility = remove ? "hidden" : "visible";

試したこと

A. 以下による非表示

javascript

1meta_blks[i].style.display = remove ? "none" : "inline";

B. 要素削除

javascript

1meta_blks[i].remove();

C. 追加で以下のスタイルを適用

javascript

1meta_blks[i].style.margin = "0";2meta_blks[i].style.padding = "0";

D. 空要素で replace

javascript

1const dummyElement = document.createElement("span");2 3if (elementToRemove) {4 meta_blks[i].replaceWith(dummyElement);5}

補足情報（FW/ツールのバージョンなど）

既存の拡張機能に BlockTube と呼ばれるものがあり、そちらを利用する限りでは自然な形でブロックしたい要素が非表示になっています。
BlockTube が要素を非表示にしている方法を参考にしたいと考えてソースコードを見ましたが、いまいちどうやっているのかが分かりませんでした。
可能であれば BlockTube が非表示にしているのと同様の手法で実現したいです。