【日常】Youtube動画貼り付けでページ表示速度が遅くならない様に処理するコードを制作中
一日の流れ
1時頃に入眠。
8時頃に起床。コンサータを服用して待機。
9時頃に活動開始。ページ表示速度向上を目指す。
13時頃に食事。
14時頃に再びページ表示速度向上を目指す。
16時頃に休憩。
18時頃にネットサーフィン。
19時頃に日常系の記事作成にあたる。
今日の行動活動の深掘り内容は、
Youtube動画貼り付けても表示速度が遅くならないコード制作中
阿部寛のホームページが凄い
です。
Youtube動画貼り付けても表示速度が遅くならないコード制作中
前回記事ではオフスクリーン画像の遅延読み込みによる、ページ表示速度向上に関して簡単ながらですが説明をしました。
この処理を応用して、Youtube動画を貼り付けているページの表示速度を向上するソースコードを制作中です。
思い描いていた処理の実現はできたのですが、毎度お馴染みの『Think with Google - Test My Site』と『PageSpeed Insights』ツールで調べてみたら何も変わらないという検証結果になりました。
体感的にはすごい速くなった気がしているのですが、ツールによる調査では特に変わらない結果に終わって頭を悩ませているところです。
なので、上記のツールでは分からない部分を調査できる方法がないのかアレコレと調べて、今後の検証に活かしていこうと思っています。
そんなこんなで、ページの表示速度に関して調べていると驚きのホームページに出くわしました。
それが、阿部寛のホームページです。
阿部寛のホームページが凄い
阿部寛のホームページの表示速度がえげつない程の速さです。
是非ともアクセスしてみてください。
くっそ速いです。笑
結構前からその表示速度の速さが話題になっていたみたいですけど、今日初めて知りました。
まさに「シンプル イズ ベスト」
ベストを尽くしています。
ちなみに上の項目で説明したツールを使用してどんなスコアを叩き出すのか気になったので調べようしたら表示速度が速すぎるのか測定不能でした。笑
これはこれで面白いホームページだなと思いました。
その他にも面白いデザインをしたホームページなども探したりして、ホームページなりブログなり、面白いデザインが色々とあるなと感心して私のブログも面白いデザインにするべく試行錯誤していきたいと思います。
以上。
【日常】お久しぶりでございます。権兵衛と申します。
一日の流れ
0時頃に入眠。
9時頃に起床。コンサータを服用して待機。
10時頃に活動開始。ページ表示速度向上を目指す。
13時頃に食事。
14時頃に再度ページ表示速度向上を目指す。
19時頃に休憩。
20時頃に日常系の記事作成にあたる。
14日の一日の流れ
1時頃に入眠。
8時頃に起床。コンサータを服用して待機。
9時頃に活動開始。ページ表示速度向上を目指す。
14時頃に食事。
15時頃に再度ページ表示速度向上を目指す。
21時頃に食事。
22時頃にベットの上でだらだら。
13日の一日の流れ
0時頃に入眠。
8時頃に起床。コンサータを服用して待機。
9時頃に活動開始。ページ表示速度向上を目指す。
13時頃に食事。
14時頃に再度ページ表示速度向上を目指す。
21時頃に食事。
22時頃にベットの上でだらだら。
12日の一日の流れ
0時頃に入眠。
3時頃に起床。Youtube視聴。
8時頃に活動開始。ネットサーフィン。
基本的にベットの上で過ごす。
途中で睡眠を挟む。
11日の一日の流れ
23時頃に入眠。
9時頃に起床。二度寝。
21時頃に起床。食事。
22時頃にベットで時を過ごす。
久し振りの記事投稿でございます
お久しぶりでございます。
権兵衛でございます。
覚えている人はありがとうございます。
覚えていない人は思い出してください。
初めましての方は是非覚えてください。
権兵衛でございます。
大事なことなので2回言いました。
タイトルと併せて3回言ってますね。
テヘペロ(n*´ω`*n)
さてさて、久しぶりの投稿となりまして、自分の記録用としても保存しておきたいのでざっくりと説明をしていきたいと思います。
12月11日に体調を崩してしまい記事の投稿ができませんでした。
私にとって毎度おなじみの過眠症状により倦怠感に襲われました。
せっかく継続日数が続いているのだからここが踏ん張りどころと思いつつも、記事に書く事柄がないし、頭も働かないという事で記事作成と投稿を断念しました。
継続日数が67日という記録で一度幕を閉じてしまいました。
無念でございます。
そして、翌日の12日もそこまで酷くはないものの継続日数が途絶えたことだし、もういいやという気持ちのもと、ゆっくりと体を休めていました。
13日からはある程度復活して、ページ表示速度向上を目指すべく奮闘していました。
本調子ではない感じで度々の休憩は多かったです。
すこ～しづつ調べては検証を繰り返していました。
そして、記事投稿は面倒だったのでサボりました。
14日から結構回復の兆しが見え始めて、前日よりも休憩の数を減らして活動することができました。
活動内容は相変わらずのページ表示速度向上を目指してました。
そして、この日も記事投稿は面倒だと思いサボりました。
今日は本調子に近い感じで活動ができました。
休憩もあまり取ることなく、ぶっ続けで活動することができたので回復したと言っても良いような気がします。
しかしながら調子乗るとすぐに体調を崩しかねないので、ぼちぼちと無理をしないで休憩を取るなり、早めに切り上げるなりして、自分を制御できるようにしたいと思います。
ご心配をお掛けして申し訳ございませんでした。
これからもブログ活動を頑張る所存でございますので宜しくお願いします。
ページ表示速度向上に成功しました
記事投稿はしていないけれども、ブログに関する活動はしていました。
それが、ページ表示速度向上です。
ページ表示速度向上に関して成功したのですが、対策方法につきましては後日ちゃんとまとめた記事を投稿したいと思いますので少々お待ちください。
前々回の記事にてちょろっと説明をしたのですが、『Think with Google - Test My Site』と『PageSpeed Insights』ツールを参考にしながらテスト用のサブブログであれこれ検証をしました。
サブブログでの検証になりますが、
「PageSpeed Insights」にある改善ポイントはあまり上昇しないものの、
「Test My Site」でのページ表示速度は速くなったのでこれで良いのかなと思っています。
対策した内容は「PageSpeed Insights」にて改善点として指摘されていた「オフスクリーン画像の遅延読み込み」について対策を講じました。
対策前の表示速度
対策前は、
ブログ全体の表示速度は2.6秒。
トップページになるように設定している記事一覧形式のページ（/archive）では2.4秒。
という結果になりました。
対策後の表示速度
対策後は、
ブログ全体の表示速度は2.4秒。
記事一覧形式のページ（/archive）では1.9秒。
という検証結果になりました。
オフスクリーン画像の遅延読み込みなので、画像の少ないページだとあまり効果を感じられないものの、記事一覧形式のトップページやカテゴリーの記事一覧形式などのページで「アイキャッチ画像」を設定して表示している場合には効果的な検証結果になりました。
オフスクリーン画像の遅延読み込みを簡単に説明しますと、画面に映っていない画像のデータ読み込みはしなくても良いからね。
スクロールしていって画面に映りそうになったらデータ読み込みして画像表示させてね。
みたいな感じで他の処理を優先させてページを完成させる処理です。
詳しい対策内容や方法につきましては後日にまとめて記事を投稿するつもりなのですが、JavaScript のソースコードを使用して対策しています。
JavaScriptのソースコードを簡単コピペで出来る様にあれこれ精査中なので、来週あたりに記事の投稿できると思います。
あと、Youtube動画を貼り付けた場合も表示速度が減少するらしいので、動画に対応した遅延読み込みをする処理も開発中です。
これも、来週に詳細記事の投稿ができる様に頑張っております。
それでは、久しぶりの投稿で長くなってしまいましたが以上となります。
またこれからも宜しくお願い致します。
【日常】シャワーを浴びるだけで疲れる権兵衛ココに現れる。
一日の流れ
3時頃に入眠。
9時頃に起床。コンサータを服用して待機。
10時頃に活動開始。ネットサーフィン。
11時頃にシャワーを浴びて出掛ける。疲労度MAX。
12時頃に食事。
13時頃にノックダウン。Youtube視聴。
14時頃にネットサーフィン。
18時頃にノックダウン。Youtube視聴。
19時頃に日常系の記事作成にあたる。
今日の行動活動の深掘り内容は、
シャワーを浴びるだけで疲労が蓄積
かる～くページ表示速度向上について調べる
です。
シャワーを浴びるだけで疲労が蓄積
出掛ける予定があったので準備しようと思いシャワーを浴びたらそれだけですんごい疲れました。
まさか、これだけで疲れるとは思わなかったので驚きました。
頭をシャンプーしてちょい休憩。
頭をリンスしたらちょい休憩。
体を洗ったらちょい休憩。
男なのに凄い長風呂をしたという感じです。
そして、浴室を出る頃には疲労感が半端ないったらありゃしない。
出掛けるのが超絶嫌に感じました。
まぁ出掛けたんですけども。
そして、この機会に正直な話をすると、毎日お風呂なりシャワーを浴びることはありません。
普段から家に引きこもっているし、汗をかくこともないので、出掛ける前ぐらいにしか入りません。
一応ちゃんと弁解をしておくと、シャワーを浴びるのが嫌いとかそういうのはなく、昔はしっかりと毎日シャワーを浴びていました。
鬱と診断されて、処方箋を服用する様になってから浴びる頻度がどんどん少なくなってきました。
なので、少なからず鬱とかが影響しているのかなぁと思うことがあります。
そういうお風呂とかシャワーを浴びることが少なくなってきたことも含めて、どんどんと体力が減少していったのかもしれません。
なので、今すぐにではないですが少しづつ体力の回復に向けてアクションを起こしていこうかなと思っています。
思っています。
思っています・・・
実行するとは言ってませんので・・・ね。
かる～くページ表示速度向上について調べる
疲れを感じていたので休憩を何回も挟みながら、またまたページ表示速度向上に関して調べていました。
懲りることなく悪あがきをしようと思っています。
前回のブックマークの方で、水がめ (id:mizugame6)さんの『はてなのデフォルトは何でもかんでも遅い気がしますね...』のコメント通り、速度向上は難しそうな感じでした。
なので出来ることと言ったら、自分が追加したJavaScriptの処理やら、CSSのコードやらがページ表示速度に影響していないか、対策はあるのか、などになりそうです。
そんなものがあるのか分かりませんが、ぼちぼち気楽に調べていこうと思います。
以上。
【日常】ページの表示速度向上を目指した。奮闘した。頑張った。うん。
一日の流れ
2時頃に入眠。
10時頃に起床。コンサータを服用して待機。
11時頃に活動開始。ネットサーフィン。
12時頃にブログをカスタマイズ。
14時頃に食事。
15時頃に休憩。
16時頃に引き続きブログをカスタマイズ。
19時頃に日常系の記事作成にあたる。
今日の行動活動の深掘り内容は、
ブログの表示速度向上に向けてカスタマイズ
カスタマイズした結果
です。
ブログの表示速度向上に努める
どこまでの影響力があるかは不明ですが、SEOにも関係してくるので、見て見ぬふりができない表示速度。
今日は、ブログの表示速度向上について再度チャレンジをしました。
前回は見事に敗北し、メンタルもろともボロボロになりました。
普通にレスポンシブに対応しているブログテーマに変えるだけで済むいう、自分の情弱を思い知らされた。
あれから2ヶ月弱の時を経て、ブログ運営に関してある程度の知識を得ることができ、成長したのだからとリベンジを決意しました。
まず、カスタマイズ前にどれほどのページ表示速度が向上したのかを知るために表示速度が計測できるツールとページ表示の改善ポイントを知ることができるツールで数値しておきました。
ページ表示速度計測ができるツール。
『Think with Google - Test My Site』
4G回線での表示速度は3.2秒という結果でした。
ページ表示の改善ポイントが分かるツール。
モバイル版が21点。
パソコン版が41点。
この点数は低ければ改善するところが多い、高ければ改善するところが少ないという目安の様な点数です。
それぞれで計測しておいて、いざ情報収集＆カスタマイズ開始です。
上記のツールにある改善点などを検索ワードにして調べつつ、色々とカスタマイズをしていきました。
どんな方法でブログの表示速度向上をしたのかについては、たぶん別の記事で投稿すると思います。
なぜ、たぶんなのか。
次の画像を見たらわかります。
カスタマイズした結果
ページ表示速度。
カスタマイズ後の結果は3.6秒という結果でした。
ページ表示の改善ポイント。
モバイル版が28点。
少しだけ上昇しました。
パソコン版は41点。
カスタマイズ前と変わりません。
ページ表示速度に関しては、0.4秒遅くなり・・・
改善ポイントも対して変わらない・・・
見事に今回も敗北しました・・・
2秒台になるかと期待していたのですが、まさかの遅くなりました。
これじゃあ記事にしてまで書くことがありません。
一応はてなブログにおいて、私が調べた表示速度改善できる方法をいくつかお教えしておきます。
- 画像の最適化（サイズ）
- 画像の最適化（圧縮）
- はてなスターを削除
- デフォルトのシェアボタンの削除
- 読者ボタンの削除
- フォロワー数の表示を削除
などなど。
詳しいやり方は・・・すまねぇ・・・ご自身で調べてくだせぇ
何が有効的なのかは、検証失敗したためにわかりませぬ。
今回も情弱乙という結果になりました・・・
無念。
一応参考になりそうなブログをご紹介しておきます。
ページの表示速度｜Googleの指示通りに改善したけどこれがはてなの限界ですか？！
体感的に感じたのは、はてなスターは重いような気がしました。
個人的に、はてなスターは外せないので別の方法を模索するつもりです。
以上。
【日常】感謝と私とブログ。私にとってブログとは何だろう。
一日の流れ
2時頃に入眠。
5時頃に起床。Youtube視聴。
7時頃にコンサータを服用して待機してたら寝た。
9時頃に起床。活動開始。ブログ探索。Twitter探索。
10時頃にネットサーフィン。
13時頃に食事。
14時頃にネットサーフィン。
15時頃にライターについて説明を受ける。
17時頃に終了。ネットサーフィン。
20時頃に日常系の記事作成にあたる。
今日の行動活動の深掘り内容は、
ふくさんに感謝
またしても、お気遣いの言葉を掛けてくださり感謝です
私とブログ
です。
ふくさんに感謝
12月5日にまたしても私の記事を紹介してくれた方がいました。
その方の名は、ふくさんです。
紹介してくれた上にあの無謀な本文0文字を真似してくれました。笑
いやはや真似までしてくれるとは、とても嬉しくこれまた、
ちょ～～～～～～～～～元気が貰えました！
ありがとうございます！
完コピではないものの、私のやり方とは違うふくさんならではの手法で真似をしてくれていました。
ふくさんは実際の紙に文字を書いたり絵を描いたりして表現をしていました。
字も綺麗で、絵も上手でふくさんの優しい人柄の様なものを感じることができました。
デザインツールで作る画像とは違い、紙に書くという事で人の温かみを感じ取れるとても素晴らしい記事です。
こういう表現の仕方をすると感じ取れるものも違ってくるのだなと勉強になりました。
ふくさんは、私と同じ自閉スペクトラム症（ASD）と注意欠陥多動症（ADHD）持ちの発達障害者なのですが特徴は真逆です。
私は言語性IQが低く、動作性IQが高いです。
ふくさんは言語性IQが高く、動作性IQが低いそうです。
だからこそなのか、ふくさんの投稿する記事は丸みを帯びている様に優しい雰囲気をかもちだして、温かい印象を受け取る事ができる文章力を持っています。
あくまで、個人的感想です。
そして、同じ発達障害でも感じることは違うし、社会に出ても起きる問題点は違ってきます。
そんな、ふくさんが感じることを色々と記事にしております。
同じ発達障害でも違いが見れたりしますので、気になる方はふくさんのブログに足を運んでみてください。
てか、私のブログは発達障害に関する記事を全く投稿していないから違いを知ることはできないか...
うん...
発達障害に関することを知りたければふくさんのブログへ！！！
（その内に私も頑張って発達障害関連の記事を増やします。）
またしても、お気遣いの言葉を掛けてくださり感謝です
度々体調を崩して、そのことを普通に日常記事に書くのですが、毎度お気遣いのコメントを残してくれてありがとうございます。
間違いなく励みになりますし、元気が貰えます。
おかげさまで今はある程度体調が良くなっています。
すぐに体調が良くなるかは分からない所がありますが、少しづつ自分のペースで回復に向かわせていきます。
体調は良くなったり悪くなったりと頻繁に起きますので、また体調が悪い的な記事が投稿されても「あぁ、またか」程度の軽い気持ちで見守ってくれますと幸いです。
一時的に悪くなるだけで、割とすぐに良くなったりします。
インチュニブ服用レポート用の記録として、投稿している節はありますので、重く受け止めないでもらえると幸いです。
今までに貰ったコメントはとても嬉しかったのですが、その半面でコメントで気を遣わせてしまっているという申し訳なさもありました。
なので、毎度コメントせずともスターだけでも十二分に嬉しくて、すぐにケロッと回復したりしますので、軽い気持ちでいて貰えると幸いです。
心配して下さった皆様、本当にありがとうございました。
私とブログ
今日に、SEOライティングを学びながらのライターをしてみないかという説明を聞きました。
聞いている分には良さそうな話で、やってみたい気もしましたが、返事としては少し考えさせて欲しいという事で答えを濁らせました。
面白そうな話でブログ運営にもプラスになるような感じでしたが、何故かブログで食っていくんだという気持ちが現れませんでした。
ブログで稼ごうとしているけど、心奥底では無理ゲーみたいに思っているかもしれません。
本気でブログで稼ぐんだっていう気持ちが出なかったので、答えを濁らしたのですが、自分は何を望んでいるのか、より一層分からなくなってしまいました。
自己理解を深めるためにブログを始めたけど、途中でアドセンスを受かり、その内に自己理解を深めるような記事だけだと稼ぐのは難しいことを知る。
だから、今はそこでストップして「私にとってブログとは」的な状態にハマっているかもしれない。
う～ん、この話は長くなりそうだし、凄い考え込みそうなので、脳みそがスッキリしていて考えることができそうなタイミングで考察してみようと思います。
以上。
