Loading…

Stinger6 Stinger7 WordPress インターネット カスタマイズ テーマ 伝えたいこと 備忘録

ページ表示速度高速化レンダリングブロック解決方法ができた!!

本日の人気記事BEST10

所要時間目安:2


Stinger6 Stinger7 WordPress インターネット カスタマイズ テーマ 伝えたいこと 備忘録

ページ表示速度高速化

ふぅ~ε=(・ρ・*) フゥ、やっとできた!!

ここ数日なんとかサイトのページ表示速度をできるだけ速く高速化したいなぁ。とずぅ~っと考えていました。今日も昨日も記事にしていますが^^;)(汗)…。おそらく完成形かと思われるレンダリングブロックされているジャバスクリプト(JavaScript)の非同期にする方法の完成形です。!!
(たぶん←今のところ問題はないと確認しています。)

実はとっても簡単だったというオチ…。

 

以前からページ表示速度が気になっている私です。今回は大きく分けて2つの事を実施しました。 ちょっとなぐり書きですが、備忘録として残しておきたいと思います。ページ

(こんなこともしてみました。)

無知って、「知らぬが仏」ということわざがありますが、「無知ほど怖いものはない」といった言葉もあります。

 

スポンサーリンク

アドセンス336pxPC閲覧記事下表示1つ目コード

 

よく読まれている人気記事一覧

田中角栄さんの名言でもある逆の「知らぬは一生の恥」、
「聞くのは一時の恥」なんて言葉もあります。

(これ逆だったかなぁ。「聞くのは一時の恥」「知らぬは一生の恥」だったかも(*゜.゜)ゞポリポリ)

まぁ、言葉は使いようなのでしょうが、知ることで・学ぶことで・勉強することで達成感や喜びも感じることができます。

 

目次に戻る


スポンサーリンク

ほんでもって本題のレンダリングブロックされているジャバスクリプト(JavaScript)の非同期化の方法ですが、

 

以前の記事にいろいろと試してみた内容を書きましたが以下のコードを子テーマのfunction.phpに追記するだけで、ちゃんと非同期化できました。

そのコードは以下になります。

 

function replace_script_tag ( $tag ) {
 return str_replace( "type='text/javascript'", 'async', $tag );
 }
 add_filter( 'script_loader_tag', 'replace_script_tag' );

 

この上記コードを子テーマのfunction.phpに追記するだけでレンダリングブロックしているジャバスクリプト(JavaScript)にちゃんとasync属性が付与されて非同期化されます。

以下の画像のようになります。

レンダリングブロック非同期化コードasync付与画像

(ちょっと見えにくいですが、src='の前にちゃんとasyncが付いています。)

 

なお、以前の記事で紹介した以下のコードの"async"の部分は削除しました。

 

ここ最近…。本当にサイトの高速化、サイトのページ表示速度を速くしなければ!!なんて思い過ぎている私です。 ない知識をフルに活用してみてはいるものの、うまくいったりいかなったり、

 

wp_enqueue_script(
 'jquery',
 '//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js',"async",
 array(),
 '1.11.3',
 false
 );

削除しなくても、問題なく動作していましたが最下部の</body>タグの前に追加・追記される形になってしまうので、一応元に戻しておきました。

 

スポンサーリンク

以下の参照サイトによって確信を得ました!!^^;)

 

WordPressでJavascriptを読み込むに使われるwp_enqueue_script()があります。wp_enqueue_script()の使い方は、wp_register_scriptとwp_register_styleの使い方に書いてある通りにしていただければ大丈夫です。WordPressで使われるwp_enqueue_script()は、Javascriptの依存関係やプラグインが使うJavascriptとの調整に使えてとても便利なのですが、今までwp_enqueue_script()に不満に思っていた点がありました。

 

どちらが良いのかは個人的には、
上記コードにも"async"属性は付けておいたほうが良いのかなぁ。

とも思いますが、
とりあえずは大事なfunction.php内のコードなので、デフォルトのテーマ内のfunction.php内のコードは元に戻しておきました。

今後、様子を見て上記コードの様に"async"属性は付けてみるかもしれません。

Stinger6, Stinger7, WordPress, インターネット, カスタマイズ, テーマ, 伝えたいこと, 備忘録」同じカテゴリ人気記事


アドセンス336pxPC閲覧記事下表示1つ目コード

おすすめの記事一部広告

関連記事

20周年サイトとBIGLOBE30周年記念サイト

PC インターネット 伝えたいこと 備忘録 光コラボ 時事ネタ

20周年記念サイト一覧とBIGLOBE30周年記念キャンペーン

インターネットが世の中に登場したのは…。 BIGLOBEが前身の1986年にパソコン通信のPC-VA…

もっと読む

メールアドレスが流出しているか確認サイト

インターネット セキュリティ 伝えたいこと 備忘録

迷惑メール撃退方法とメールアドレス流出元を確認する方法と対策方法

先月くらいにやたらとウイルス付き迷惑メールがあちこちから送られてきていました。 しかし、その後1ヶ月…

もっと読む

高梨沙羅選手イモトアヤコ似でなく相武紗季似になってきた

伝えたいこと 備忘録 時事ネタ

高梨沙羅さん綺麗になって相武紗季さん似になった気がする。

もう言わずと知れた女子スキージャンプ(ラージヒルジャンプ)で超有名人である高梨沙羅選手です。 最近テ…

もっと読む

引用元サイトの選択テキスト部分を自動的に生成された引用タグ表示場所

PC カスタマイズ ツール ブックマークレット 伝えたいこと 備忘録

引用元<blockquote></blockquote>タグを自動生成するブックマークレット選択したテキスト部分のみ

ブログをやっている方やサイト運営されている方って、必ずと言っていいほど引用することが出てくると思いま…

もっと読む

よろしかったらシェアよろしくお願いします。

おすすめ!!

世界中でNo.1のシャアを誇るAmazonでのお得なお買い物でお得をしよう!!ネット通販なので、もちろん24時間年中無休です。健康商品から食品、車カスタマイズ商品、大手家電メーカー商品やパソコンの自作サプライ商品、その他アマゾン・プライムでは映画やドラマなど多くの作品や番組を見ることができます。マスクなど衛生商品も今では必須アイテム。一番信用できて一番商品数の多いAmazonでの買い物が絶対にオススメ!!

おすすめ2

楽天による季節特集です。それぞれの季節ごとにお得なお買い物商品やお得な旅行商品、その他にもAmazon同様に国内最大の買い物ポータルサイトです。楽天をメインにお買い物されている方はポイントやSPUも貯まりさらにお得に!!楽天カードや宇佐美系列のガソリンスタンドでも楽天ポイントが今では貯まります。それらのポイントを貯めてお得にお買い物や旅行商品その他にもパソコンサプライや車カスタマイズ商品など楽天も充実しています。

-Stinger6, Stinger7, WordPress, インターネット, カスタマイズ, テーマ, 伝えたいこと, 備忘録



この記事が良かったら
いいね!お願いします(#^.^#)

WordPressデビュー津々浦々の
最新情報をお届けします

言えないことはTwitterで!!



目次に戻る


コメントを閉じる

comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください