この記事ではWordpressのブロックエディタが遅い時の対処方法について説明しています。
WordPressがブロックエディタに切り替わって仕方なくブロックエディタを使っているけど、どうも記事が書きにくいなと感じる人には参考になるかもしれません。
WordPress6.0がリリースされてこの記事で問題にしていた遅さは改善されました。
私はブロックエディタが激重なのに耐えられなかったので、Wordpress6.0にアップデートしていますが、Wordpress6.0は不具合が多いので、Wordpress6.0.1を待ってから更新した方がいいかもしれません。
ブロックエディタは遅くて使いにくいは本当か?
WordPressはバージョンアップするたびにブロックエディタの進化が進んでいます。ブロックエディタで記事を書く効率の悪さに嫌気がさしてclassic editorを使い続けている人も多いと思います。各自目的が違いますので、最適なツールを選択するのが正義です。効率が上がるのであれば世間の声は無視してclassic editorを使い続けるのは正しいと思います。
個人的に一番謎なのは、ブロックエディタでclassicブロックだけを使用して記事を書いている人が一定数いることです。classic editorが廃止される(実際にはプラグイン)という理由から、中途半端にブロックエディタの中でclassicブロックを使っているのだと思いますが、正直書きにくいだけです。
WordPressのブロックエディタ自体は悪いものではないと思います。Wordpressインストール直後のまっさらな状態だと、軽快に動作しますし、ストレスも感じません。
ブロックエディタを便利にするテーマやプラグインは本当か?
初期テーマやインストール直後だと軽快に動くWordpressのブロックエディタですが、有料テーマを使ったり、ブロックエディタを拡張するプラグインを導入すると話が変わってきます。
ブロックエディタの編集画面を使いやすくしてくれる便利なプラグインの一つに、snow monkey editorというプラグインがあります。
Snow monkeyを使っている人はSnowmonkey blocksとSnowmoneky editorの2つのプラグインはとりあえずインストールするのがデフォルトになっています。どちらも素晴らしいプラグインでWordpress公式に登録されています。しかし、なぜかWordpress公式でのプラグインサポートはほぼ放置状態であり、一方でSnowmonkeyの有料フォーラムでは積極的にサポートするという男前なプラグインであります。
いままで、Snowmonkeyを使って真面目にブログ記事を書いたことが無くて気にしていなかったのですが、いざ書こうとするとブロックエディタの反応がメチャクチャ遅くてまともに記事が書けない。
Cocoonを使っている時には軽快に動作するブロックエディタがなぜにこんなにモッサリしているのか?
理由は、Snow monkey editorでした。証拠にSwnomonkey editorを無効化するとブロックエディタの動作が軽くなります。
これは何かおかしい。
なぜなら、以下のようなふれ込みで作者がリリースしているからです。
Gutenberg ブロックエディターの機能を拡張してブログの書きやすさを爆上げするプラグイン Snow Monkey Editor をリリースしました!
https://snow-monkey.2inc.org/2020/01/20/snow-monkey-editor/
しかし、Snow Monkey editorを使い続けたいという思いもありますので、激重のSnow Monkey editorを軽くする方法についてまとめておきます。
原因:改行するたびにスタイル一覧が読み込まれてパネルに表示される
Snow Monkey editorは段落ブロックに右側のパネルからスタイルを選択できるようになっています。
このパネルのスタイルの読み込みに1秒前後かかるようで、悪いことに改行した時のデフォルトブロックが段落ブロックになるので、必ず表示されるまでの待ち時間が発生し、エディターの反応が激遅になります。
実は、この機能は以前のCocoonにもありました。その当時、とてもエディタが遅くなって使いにくくなって困った記憶があります。その後、作者も遅すぎて使いにくいと思ったのか、Cocoonは段落ブロックのスタイルをやめて、グループに対するスタイルを選べるように仕様変更されました。
問題:Snow Monkey editorはオプションで機能のON/OFFができない
なぜかわからないのですが、その当時のCocoonの段落ブロックのスタイルも、Snow Monkey editorの段落ブロックのスタイルと同じく、スタイルの中身が初期状態でOpenになっていて毎度表示されます。この部分が閉じていたらスタイルを読み込まないのではないかと思うのですが、なぜか初期状態で必ず開いています。
これは以前、Cocoonでも同じ状態だったのでブロックエディタの仕様なのかもしれません。
いっそのこと、使わないスタイルは読み込まないようにフックでもあればいいものですが、jsのためかプラグインのオプション設定自体が無く、個別の機能のON/OFFはできません。
解決方法:右側のパネルをギヤマークで非表示にする
右側のパネルは常に表示するようにしていましたが、実は普通に記事を書く時には使用頻度は低いです。
右側のパネルをギヤマークをクリックし、パネルを非表示にすると、パネルの中身を読み込まなくなります。
その結果、エディタの動作が一気に軽くなり、軽快に動作するようになります。
このギヤマークをクリックして何度かトグルさせてみてください。パネルの読み込みに毎回時間がかかってるのがわかると思います。ブロックエディタのチューニングの問題のような気もします。
参考:SWELLはパネルのスタイルの読み込みが速い
ブロックエディタで軽快にブログが記述できると話題のSWELLの場合はどうでしょうか?
SWELLでも、Snow Monkey editorと内容は違いますが、段落ブロックのスタイルがパネルに表示されます。しかし、SWELLでは、Snow Monkey editorのように改行のたびにスタイルが読み込まれてチラついたりモッサリすることが無いです。
SWELLでブログを書くときにストレスを感じない、書くことに集中できると感じるのはこれが一番大きな理由だと思います。
恐らくデータの読み込みなどの最適化がされているものと思われます。
そもそも、公式テーマだとブロックエディタ自体は軽快に動作し、ストレスを感じることが少ないのですがその軽快さを維持できているかどうかが生死の分かれ目だと思います。
Snow Monkeyを使っていたサイトがいつの間にかSWELLに切り替わっているのは結構よくある話です。一度SWELLを使ってしまうと記事を書く時のストレスが全然違うので乗り換えてしまうのだと思います。
SWELLの好き嫌いは置いておくとして、この辺が有料テーマと無料プラグインの違いなのかもしれません。
jsでブロックのスタイルを削除できる(要調査)
同じことを考える、悩んでいる人は結構多いのか、ブロックのスタイルを削除したいという人はいるようです。
カスタマイズの仕方は以下の記事に詳しいです。PHP経由でフックできるので、一般人でも適用しやすいのではないでしょうか?
一部だけ削除しても速度的には効果はあまりないと思うので、スタイルを限定して使いやすくするという目的にはいいかもしれません。
やはり、速度改善にはギヤマークでOFFにする方が良いと思います。
ブロックエディタのその他の高速化方法
今回ご紹介した内容以外にもブロックエディタを高速化する方法はあります。
アプローチとして、ブロックエディタの操作方法による高速化と読み込む内容を減らして高速化する方法があります。
ブロックエディタの操作方法による高速化
読み込む内容を減らして高速化
まとめ
Snow Monkeyのブロックエディタが重くてまともに使えない。何か変だぞということで、色々調べたらSnow Monkey editorのスタイル読み込みが悪さをしていました。毎度そのスタイルを使うのであればいいのですが、使いもしないスタイルの読み込みに1秒前後かかるのはさすがにブロックエディタ離れにつながるレベルだと思います。
Snow Monkey editorを使う時は、右側のパネルを非表示にするとCocoonと同じように軽快に動作するので記事の執筆に集中できるようになります。