タイトルの通りです。

最近あまり更新していない当ブログですが、しさしぶりに長めな(1.5万字越え)記事を書いて公開しようとしたら、そのページを編集している時だけwordpressが急に重くなってフリーズするということがありました。

↓問題の記事

最初はwebサーバーを疑いましたが、webサーバー自体特段問題なく動いてるようで、その記事をの編集画面は固まっていても、同時に他のページを編集しようとすると普通に編集することができました。

なら、プラグインのせいかと思って一通りプラグインを無効化してみましたが依然として重くて画面がフリーズしてしまいます。

wordpressやPHPのバージョンを更新しても無駄で、途方にくれました。せっかく長い記事を気合を入れて書いたのにまともに編集できないので公開までこぎつけられない・・・。絶望です。

 

一枚の画像がbase64で文字列にエンコードされて貼り付けられていた

 

はい。原因はこれでした。

ビジュアルエディタで編集できないので、テキストエディタで編集しようとしたのですが、まず切り替わるのに時間がかかりました。1分くらい放置したら切り替わったのですが、その後もまともにスクロールできない。

で、記事の最後にたどり着くために頑張ってスクロースしていたのですが、途中でなぞの文字列がダーとしたまで続いている箇所があってなんだこれーぇ!ってなりました。

base64で保存してしまうとwirdpressが重くなる

ただ、よくよく見るとその文字列に見覚えあったんですよね。昔、データベースに直接画像をどうしても入れなくちゃいけないということがあって、しょうがなくbase64という形式で画像を文字列に変換して保存したことがありました。

登録した画像が少ないうちは問題なかったのですが、そのうちまともにクエリが実行できなくなりました。

base64は画像の01のバイナリデータを6ビットに分割して文字列に変換する方式だそうです。これをやると画像データが大量の文字列に変換されてしまうし、画像として表示するときはもう一度バイナリデータに変えないといけないし、文字列と表示しようとしても長すぎて重くなるしほんといいことないそうですが、それがいつもの間にか記事に挿入されてました。

 

 

原因は旧エディタで無理やり画像をコピペしたから

 

じゃぁなんで、そんな形式の画像が張り付けられたかっていうと無理やりスクショをペーストしようとしたからです。

新エディタのGutenbergならコピペで画像を貼り付けられますが、このブログは使ってるテーマが古いのでGutenbergで変種するとレイアウトが崩れるんですよね。

で、旧エディタを使ってるのですが、旧エディタはプラグインを入れない限りコピペは使えません。

なのに癖でコピペをしたら、ある時貼り付けられてしまったとがありました。

まぁいいっかと放置していたのですが、おそらくあれはブラウザとかローカル側の機能でbas64に変換されて貼り付けられていたのだと思います。

ちなみに、ビジュアルエディタではbase64でも見た目は変わりません。

base64で画像を貼り付けても見た目は変わらないけど、重い!

貼り付けた当初は別に何ともなかったのですが、編集していくうちにさらにデータが増えて、ブラウザのメモリを圧迫し始めたのだと思います。それで急にクライアント側でwordpressが動かなくなり始めたのではないでしょうか?しらんけど、

まぁ、原因不明で一部の記事が重くなったらビジュアルエディタで画像が文字列で保存されていないか見たほうがいいという話でした。

うーーんでも、なんでそんなこと起きたのかな?僕だけか?

 

それでは。