特典機能について

スクロール パフォーマンスを高める受動的なリスナーが使用されていません | 不具合報告 | Cocoon フォーラム

サイト内検索
書き込みの前に以下の3点をご確認ください。
  1. 1つのトピックにつき1つの質問を書き込んでください
  2. 不具合・カスタマイズ対象ページのURLを提示高速化を無効にしてください
  3. 該当部分のキャプチャ・環境情報とともに書き込んでいただけると助かります

何を書き込んだら良いか分からない場合は、以下のテンプレートをコピペしてご利用ください。

対象のページのURL:

相談内容:

解決のために試したこと:

※文字だけでは正しく伝わらない可能性があるため、画像の添付もお願いします。
※高速化設定をしている場合は無効にしてください。
環境情報:

※↑こちらに「Cocoon設定 → テーマ情報」にある「環境情報」を貼り付けてください。

環境情報の取得方法はこちら。
https://wp-cocoon.com/theme-report/
高速化設定を無効にするにはこちら。
https://wp-cocoon.com/theme-trouble/

フォーラム利用ガイドリンク

  1. フォーラムガイドライン
  2. よくある質問と答え(FAQ)
  3. サポート対象外のケース
  4. 原因不明の不具合用トラブルシューティング
  5. トピックにHTMLを貼り付ける方法(推奨ツール:notepad.pw
  6. 真っ白画面でのエラーメッセージの確認方法 
  7. ブラウザ環境チェックツール

フォーラム質問後、問題等が解決した場合は結果を書き込んでいただけると幸いです。同様の問題で調べている方には、結果が一番気になる部分となります。

また、問題の解決に至った場合には、トピック冒頭の「解決済み」リンクをクリックしていただけますと幸いです。

wpForoの解決済みリンク

また、有用な返信があった場合は「いいね!」リンクもご活用ください。返信者の励みになります。

wpForoのいいねリンク

「いいね!」機能はフォーラム登録者のみが利用できる機能です。

CC BY-ND 2.1)準じていれば(リンクを貼っていただければ)転載も自由です。カスタマイズ記事を書く際にコード等をコピペ利用していただいて構いません。

フォーラムの使い方がよくわからない場合は、テストトピックで自由にテストしていただいて構いません。

最近の書き込みはこちら。

詳細なカスタマイズ依頼をするならこちら。

スポンサーリンク
スクロール パフォーマンスを高める受動...
 
共有:
通知
すべてクリア

[解決済] スクロール パフォーマンスを高める受動的なリスナーが使用されていません


会社員
 会社員
(@会社員)
ゲスト
結合: 11か月前
投稿: 16
Topic starter  

PageSpeed Insightsnにて
スクロールパフォーマンスを高める受動的なリスナーが使用されていません
とでたので何かな?と思い調べたところ、baguetteBox.min.js が怪しいとわかりました。

 { passive: true }

を追加すると良いと、あちこちでみかけ、触ってみましたが、
追加してよいものなのか、そもそも親テーマを触るのはいかがなものか
と思い報告させて頂きました。

何か策があればご教示下さい。よろしくお願い致します。

This topic was modified 2か月前 by わいひら

未解決
わいひら
(@yhira)
メンバーサイト Admin
結合: 4年前
投稿: 12730
わいひら - Facebookわいひら - Twitter
 

を追加すると良いと、あちこちでみかけ、触ってみましたが、
追加してよいものなのか、そもそも親テーマを触るのはいかがなものか

もしよろしければ、参考になさったページのURLを教えていただいてよろしいでしょうか。
こちら側で検証し、もし修正が必要であれば修正したいと思います。

検索すれば出てくるかもしれませんが、できれば同じ環境で確認したいのでよろしくお願いいたします。


はる
(@haruinoue)
メンバーサイト Moderator
結合: 1年前
投稿: 766
 

テスト


会社員
 会社員
(@会社員)
ゲスト
結合: 11か月前
投稿: 16
Topic starter  

@haruinoue はるさん ありがとうございます。

コードは書きこんでいなく、サイトUR位だったのですが…

書き方がまずかったのか、何なのか。

この返信が上手く返せればいいなと思いつつ

書いています。


はる 件のいいね!
会社員
 会社員
(@会社員)
ゲスト
結合: 11か月前
投稿: 16
Topic starter  

@yhira わいひら様 お忙しい中返信ありがとうございます。

投稿者: @yhira

参考になさったページのURLを教えていただいてよろしいでしょうか。

https://notepad.pw/share/e218yl4q2  

同じJsではないのですが、

passive:trueが特に有効なイベント wheelmousewheeltouchstarttouchmove

というのをヒントに素人なりに実行してみましたが、

PageSpeed Insightsnの診断は変わらなかったのと、
テーマが丁度更新されたので、触らずテーマのままにしておきました。

 

診断にずっとでてくるので気にはなるのですが、
特に不具合があるのか?と言えばそうでもないですし
お時間ができた時にでも検証頂けたらと思います。

よろしくお願い致します。


会社員
 会社員
(@会社員)
ゲスト
結合: 11か月前
投稿: 16
Topic starter  

なぜか、3種類のリンクを貼り付けると返信が出来なかった為、

notepad.pwにリンクを貼り付けてあります。

お手数ですがよろしくお願い致します。


わいひら
(@yhira)
メンバーサイト Admin
結合: 4年前
投稿: 12730
わいひら - Facebookわいひら - Twitter

わいひら
(@yhira)
メンバーサイト Admin
結合: 4年前
投稿: 12730
わいひら - Facebookわいひら - Twitter
 

Wordfence Securityプラグインによって、攻撃と勘違いされてブロックされたみたいです。
おそらく、jsとか何かしらのコードが、プラグインのNGワードかいろいろな要素が諸々あいまってブロックに引っかかったのではないかと思います。
プラグインのことなので、詳しいことはわかりません。

Block Reason: A potentially unsafe operation has been detected in your request to this site


わいひら
(@yhira)
メンバーサイト Admin
結合: 4年前
投稿: 12730
わいひら - Facebookわいひら - Twitter
 

あとよろしければで良いのですが冒頭のPageSpeed InsightsでチェックしたページのURLもいただいてよろしいでしょうか。

This post was modified 2か月前 by わいひら

会社員
 会社員
(@会社員)
ゲスト
結合: 11か月前
投稿: 16
Topic starter  

@yhira わいひら様 

Wordfence Securityプラグインによって、攻撃と勘違いされてブロックされたみたいです。

攻撃したつもりはなかったのですが…😓 
とりあえず、@haruinoue はるさんのお力を借り、
返信ができるようになったので良かったです。

PageSpeed InsightsでチェックしたページのURL

https://ideal-jp.com/  になります。

JavaScript縮小化のチェックははずしておきましたが、
他もはずしておいた方がよろしいでしょうか?

翌日対応になり申し訳ないですが、よろしくお願い致します。

 


会社員
 会社員
(@会社員)
ゲスト
結合: 11か月前
投稿: 16
Topic starter  

@yhira わいひら様

午前中にPageSpeed Insightsを行った際は今まで通り
スクロール パフォーマンスを高める受動的なリスナーが使用されていません
とでていたのですが、

帰る前にもう一度と思いPageSpeed Insightsを行うと合格しておりました。

この間にやった事といえば、2.3.3にアップデートしたことと
functions.phpにJavaScriptの読み込みを遅らせるコードを追加したくらいです。
画像を触ったりとかもしていますが…

とりあえずご報告まで。明日もう一度試してみます。


わいひら
(@yhira)
メンバーサイト Admin
結合: 4年前
投稿: 12730
わいひら - Facebookわいひら - Twitter
 

とりあえず、今チェックしてみた限りでは、僕の環境からでも問題ないみたいですね。


会社員
 会社員
(@会社員)
ゲスト
結合: 11か月前
投稿: 16
Topic starter  

@yhira わいひら様

今朝も問題なかったです。

どうしてなのか?と知ってみたい気もしますが…
深く考えないようにします。

とりあえず一安心致しました。

お忙しい中時間さいて頂きありがとうございました。
また、何かの際はよろしくお願い致します。

 


mk2
(@mk2_mk2)
メンバー Moderator
結合: 7か月前
投稿: 2088
 

突然失礼します。

functions.phpにJavaScriptの読み込みを遅らせるコードを追加したくらいです。

おそらく上記の影響によりjQueryに多数エラーが出ています。

 
 
全部は調べていませんが、以下に影響が出ているものと思われます。
  • BaguetteBox(画像拡大効果)
  • Scrollable-table
  • クリップボード動作(SNSシェアの「コピー」)

 

これらの機能が不要であれば、気にしなくて良いと思います。


わいひら 件のいいね!
mk2
(@mk2_mk2)
メンバー Moderator
結合: 7か月前
投稿: 2088
 
投稿者:: @mk2_mk2

これらの機能が不要であれば、気にしなくて良いと思います。

上記のように書いてしまいましたが、本当に問題ないのか、すべてご確認なさることをお勧めします。

JavaScriptの読み込みを遅らせたため、実際の処理の時には、まだjQuery本体が読み込まれていない?ものと思われます。


会社員
 会社員
(@会社員)
ゲスト
結合: 11か月前
投稿: 16
Topic starter  

また、何かブロックされてしまったようなのでTESTです。


会社員
 会社員
(@会社員)
ゲスト
結合: 11か月前
投稿: 16
Topic starter  

@mk2_mk2 様 ありがとうございます。

何かエラーが一つあるのは知っていましたが、
あぁいつの間にか増えているんですね 😓

以前からキャッシュ系のプラグインが合わず、
本日、いろいろと試行錯誤しておりました。
一つずつ解決できるものはと思っていますがなかなか。
また、赤色のモノが増えてると思うと…

とりあえず、大きく何かおかしいとかではないと思うので、
いろいろ調べながら、一つずつやってみたいと思います。

JavaScriptの読み込みを遅らせるコードを削除してみると
”スクロール パフォーマンスを高める受動的なリスナーが使用されていません”
と、またでてきましたので、
JavaScriptの読み込みを遅らせるコードを追加しても問題ないか
あらためて後日調べたいと思います。

休み期間は、JavaScriptの読み込みを遅らせるコードを削除しておきます。

また、何かの際はお力添え下さいますようお願い致します。


会社員
 会社員
(@会社員)
ゲスト
結合: 11か月前
投稿: 16
Topic starter  

ちなみに、どこからかで調べて貼り付けたコードです。

<コード>や“引用”に貼り付けても、ブロックされてしまったので

https://notepad.pw/code/15badglh


会社員
 会社員
(@会社員)
ゲスト
結合: 11か月前
投稿: 16
Topic starter  

こちらが正しいコードです。先程には最後の部分がなぜか入力されておりました。

https://notepad.pw/code/opw9vyys


mk2
(@mk2_mk2)
メンバー Moderator
結合: 7か月前
投稿: 2088
 

会社員さん

只今出先で、ちょっと詳細は確認できません。

ただ言えるのは、JavaScriptの読み込みを遅らせた場合、トラブルが多いことは一般的に知られています。

このフォーラムでも、過去に何度もそういう事例がございました。

Cocoonも、昔はJavaScriptの読み込みを遅らせる機能を、有しておりました。

しかしながら、やはりトラブルが多く廃止した経緯がございます。

Cocoonのトラブルというよりも、埋め込みやプラグイン等に、トラブルが発生していたような記憶がございます。

PageSpeed Insightsの数字をとるか、JavaScript(jQuery)の安定稼動をとるかは、個々のご判断かと思います。

もしくは、個別にjQueryの定義は先にする対応が必要なのかもしれません、JavaScriptの読み込みを遅らせたままにするのであれば。
やり方は分かりませんが。


わいひら 件のいいね!
会社員
 会社員
(@会社員)
ゲスト
結合: 11か月前
投稿: 16
Topic starter  

@mk2_mk2 様 お忙しい中、お返事すみません。ありがとうございます。

PageSpeed Insightsの数字というよりエラーちっくな赤色達が気になっただけなので…

/cocoon-master/plugins/baguettebox/dist/baguetteBox.min.js?ver=5.8&fver=20210720125341baguetteBox.min.js

上記、cocoon-masterの名前があがった為、これが問題なのかなと思い
ご相談した次第でございます。


mk2
(@mk2_mk2)
メンバー Moderator
結合: 7か月前
投稿: 2088
 

会社員さん

/cocoon-master/plugins/baguettebox/dist/baguetteBox.min.js?ver=5.8&fver=20210720125341baguetteBox.min.js

上記がBaguetteBox(画像拡大効果)です。

JavaScriptの読み込みを遅らせたため、baguetteBox.min.js実行時に、jQueryが未定義になってしまい、結果的にエラーになっていると思われます。

JavaScriptの読み込みを遅らせなければ、発生しないと思われます。

BaguetteBox(画像拡大効果)をお使いにならないのでしたら、Cocoonの設定から画像拡大効果を、OFFにすることができたと思います。

基本的には、個別カスタマイズに当たると思いますので、対処もご自分で…というのが、原則かと思います。


mk2
(@mk2_mk2)
メンバー Moderator
結合: 7か月前
投稿: 2088
 

なお、画像拡大効果については、以下のCocoonのマニュアルページをご参照ください。

https://wp-cocoon.com/lightbox-libraries/

Cocoonのマニュアルは、大変良くまとまっていますので、他の機能についても、ご一読いただきますよう、お願い致します。

(多機能ですから一読では覚えられませんが。)


mk2
(@mk2_mk2)
メンバー Moderator
結合: 7か月前
投稿: 2088
 

BaguetteBoxがPageSpeed Insightsで指摘されるとの意味であれば、前述の通り、機能をOFFにすることもできます。

複数の話があり、私が少し認識違いをしているようです。
すみません。

スマホからはやはり厳しいですので、この辺で。


わいひら
(@yhira)
メンバーサイト Admin
結合: 4年前
投稿: 12730
わいひら - Facebookわいひら - Twitter
 

baguetteBoxは他の方が開発されているjQueryプラグインなんで変更してよいものかわからないんですね…。
https://feimosi.github.io/baguetteBox.js/
ただ、Cocoonで使用していたものはv1.9.0で最新版はv1.11.1だったのでテーマのものをアップデートしておきました。
------------------------------------------------
https://github.com/yhira/cocoon
開発中の最新ファイルをダウンロードする場合は、上記ページのダウンロードボタンからzipファイルをダウンロードしてください。

FTPでのアップデート方法はこちら。
https://wp-cocoon.com/ftp-update/
------------------------------------------------
そしたら、当サイトでも改善されたんで、これでbaguetteBox.jsは問題ないかもしれません。


会社員
 会社員
(@会社員)
ゲスト
結合: 11か月前
投稿: 16
Topic starter  

わいひら様 mk2様

投稿者:: @yhira

Cocoonで使用していたものはv1.9.0で最新版はv1.11.1だったのでテーマのものをアップデートしておきました。

ご指示頂いた通り、アップデート致しました。当サイトも改善されました。
ありがとうございます。
Cocoonで使用されているプラグインも自動で更新されていると思っていました。
とても手間がかかっているのがわかりました。いつもありがとうございます。

投稿者:: @mk2_mk2

BaguetteBox(画像拡大効果)をお使いにならないのでしたら、Cocoonの設定から画像拡大効果を、OFFにすることができたと思います。

こちらも検討させて頂きます。ありがとうございます。

 

cocoon-masterで使われているプラグインだとはわかっておりましたが、検索したりして、なるべくお手をかけまいと試行錯誤しましたが、どうにもならず…。cocoon-masterで使用しているものなので今回はこちらで相談させて頂きました。

お忙しい中、ご教授いただきありがとうございました。


わいひら 件のいいね!
わいひら
(@yhira)
メンバーサイト Admin
結合: 4年前
投稿: 12730
わいひら - Facebookわいひら - Twitter
 

ご確認いただきありがとうございます!


共有:
スポンサーリンク
SWELLと業務提携しています
WordPressテーマSWELL
わいひらをフォローする
おすすめサーバー(コスパ・バックアップ重視型)

性能も兼ね備えながら安くブログ運営を開始できる点においてのNo.1。
それでいてブログ成長後は、十分すぎるほどのスペックアップ余力も担保されている。

◎安く始められる
◎LiteSpeedを用いた高速サーバー(完全SSD)
◎http/3(高速化プロトコル)に対応
◎東京・大阪でリージョン選択が可能
◎プランのアップ・ダウングレードが自由自在
◎同サービス内でドメイン管理が可能
◎ディスク容量が多い
◎転送量が多い
◎毎日無料バックアップ(14日分)
◎DBは14日以内なら無料自動復旧可能
◎ファイルも14日以内なら無料自動復旧可能
◎アダルト・出会い系サイト可
◎ドメインとサーバー代のチャージ払いが可能
○サーバ引っ越し依頼が可能(有料)

サービス運営期間:3年

1年以上の契約をする場合は、クーポンコード入力でさらに50%割引キャンペーン中!
※BOX2 ~ BOX8プラン契約の場合

クーポンコード:PK4JK4RJ

クーポンの使用方法はこちら

とにかく速い。サイトに表示スピードを求めるならココ。
管理画面がシンプルで使いやすい。

◎nginxを用いた高速サーバー(完全SSD)
◎プランのアップ・ダウングレードが自由自在
◎同サービス内でドメイン管理が可能
◎ディスク容量が多い
◎転送量が多い
○http/2(高速化プロトコル)に対応
◎毎日無料バックアップ(14日分)
◎DBは14日以内なら無料自動復旧可能
◎ファイルも14日以内なら無料自動復旧可能
◎サーバ引っ越しツールあり(無料)
○サーバ引っ越し依頼が可能(有料)
◎ドメインとサーバー代のチャージ払いが可能

サービス運営期間:3年

安定感抜群のサーバーです。あまり急激なアクセス変動がないアフィリエイトサイトに向いています。

◎nginxを用いた高速サーバー(完全SSD)
◎老舗サーバーなので安定感抜群
◎ディスク容量が多い
◎転送量が多い
◎同サービス内でドメイン管理が可能
○http/2(高速化プロトコル)に対応
○毎日無料バックアップ(14日分)
○DBは7日以内なら無料自動復旧可能
×ファイルは有料かつ手動での復旧
×プラン変更でCPUのスペックアップができない
×プラン変更しても即時反映されない
×アダルト・出会い系サイト不可

サービス運営期間:18年

常に新しいことに挑戦しているフロンティア精神あふるるレンタルサーバーです。
LiteSpeedやHTTP/2を日本で初めて導入したサーバー。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎http/3(高速化プロトコル)に対応
◎プランのアップ・ダウングレードが自由自在
◎同サービス内でドメイン管理が可能
◎転送量が多い
◎ディスク容量が多い
◎毎日無料バックアップ(14日分)
◎DBは14日以内なら無料自動復旧可能
○ファイルは14日以内なら無料復旧可能(※手動)
◎アダルト・出会い系サイト可
◎ドメインとサーバー代のチャージ払いが可能
○サーバ引っ越し依頼が可能(有料)

サービス運営期間:5年

格安な値段で始められる高機能サーバーです。
性能も備えつつ最安ならここ。
ただし少し機能は弱い。

◎LiteSpeedを用いた高速サーバー(完全SSD)
◎激安プランが用意してある
◎値段あたりのスペックが高い(コスパ良し)
◎サーバ引っ越し依頼が可能(無料)
◎アダルト・出会い系サイト可
○http/2(高速化プロトコル)に対応
△プランのアップは可能だがダウンは不可
△毎日自動バックアップ(1日分)
△前日のバックアップからのみ復元できる(無料)

サービス運営期間:5年

Cocoon
タイトルとURLをコピーしました