ダイナミックレンダリングとは？
ダイナミックレンダリングとは、グーグルが将来的に導入を進めているクローラーの新しい機能です。JavaScriptフレームワークなどを使用して作られた動的なページをクロールして、サーバサイドでレンダリングされるデータと、クライアントサイドでレンダリングされるデータをそれぞれ索引付けに利用するというものです。
ダイナミックレンダリングが推奨される場合
・頻繁に変化する大規模なウェブサイトの場合。
・ソーシャルメディアの存在感の強いウェブサイトの場合（共有ボタンは画像とコンテンツを共有するためにレンダリングされたページを必要とするため）
・新しいブラウザの機能を使用するウェブサイト（バージョン41以降のCrhome）。
Javascriptで作られた動的サイトもダイナミックレンダリングによりクロールできるよというところでしょうか。
クローキングも可能なのではという指摘にgoogleのポリシーも若干変更するとのことです。
SEO情報は定期的に仕入れましょうと過去に書いた割には、あまり調べていなかったのですが、SEO界で有名な鈴木さんの海外SEOブログにて「ダイナミックレンダリング」とやらのキーワードを目にしました。
記憶にある範囲ではPWA(プログレッシブウェブアプリ)など今後おもしろそうだな・・と感じていましたが、SEO界隈もどんどん技術的な面でも進んでいきます。
レンダリングというと映像編集で最後の書き出し作業を思い浮かべるのですが、ブラウザでもHTMLやJavascriptを人間の目に見えるように表示することをレンダリングと言いますね。
ダイナミックというからには動的にレンダリングということですが、読んでいくと、
- ユーザーがアクセスしてきた場合には、一部もしくは全てのコンテンツをブラウザでレンダリングさせる
- Googlebotがアクセスしてきた場合には、サーバー サイド レンダリングしたコンテンツを返す
だそうです。
node.jsをはじめとしたjavascript環境でフレームワークを使ったPWAやSPA（シングルページアプリケーション）はサーバサイドで実行される技術なので、ダイナミックレンダリングが導入されると動的ページも気にせず制作できそうです。
古い知識ではjavascriptはSEOに効果なしと言われていましたが、時代も変わるものです。
もちろんコンテンツファーストはかわらず、PWAだから優遇されるというのはないでしょう。
まったく勉強が追いついてないのですが、アプリ開発よりPWAには将来性を感じていたので、クリップしました。
Google I/O ’18 動画の２１分あたりからダイナミックレンダリングが語られています
PWAとは
ひとことでいうとアプリのようなwebページです（!）
App storeやgoogle playを通さなくてもいいのでインストールするまでの心理的負担が大きく減ると思います。
プッシュ通知などもできるらしく、課金などの決済面が充実すれば利用する企業は多くなると思います。
すでにインスタグラムやsuumoなどで導入されているそうです。
PWA 入門 〜iOS SafariでPWAを体験するまで〜 2018年3月版
ダイナミックレンダリングに役立つツール
GoogleChromeのライブラリのひとつでたくさんのAPIが用意されているそうです。
1行書くだけでページのスクリーンショットを撮ったり、PDFを作ったり。
動的サイトのスクレイピングもできるそうです！これはおもしろそう。
動的なサイトもパペッターならいじくれるようです。
rendertronを使うとこんなことができるそうです。
https://render-tron.appspot.com/
実験
簡単なjavascriptフレームワークMithril.jsのチュートリアルも
↓
https://render-tron.appspot.com/screenshot/https://seonote.link/mis.html?width=1440&height=691
こんな感じにスクリーンショットされました＾＾；（微妙）
ヘッドレスクロームと組み合わせて、いろいろなことができそうですね！
全く技術も知識も及びませんが。
将来的に
javascriptフレームワークはすぐに必要とは思っていませんでしたが、これなら導入しても良いと思い始めました。
ここ数年、確実にサーバーサイドの知識は必須です。
