2019年7月29日WordPress構築歴10年位以上、インフラもそこそこやれるPHPエンジニアが最近話題の「Shifter」を実際に触ってみました。この記事はどちらかというと業界向けです。視点がエンジニアなので一般の方には向かないかもしれませんが、できるだけ細かく解説します。今回は「Shifter」の紹介と簡単な使い方、最後に「検索」は動くのか?というお話まで。サーバレスWordPress「Shifter」とはそもそもWordPressなのに「サーバーレス」ってどうゆこと??Shifterのサイトにはこう書いてあります。(Chrome翻訳機能にて翻訳したものです)常にオンになっている静的ページを無制限のスケーラビリティでホストし、必要なときだけオンになる完全管理のコンテナ環境でWordPressを実行します。https://www.getshifter.io/さらに静的サイト生成とサーバーレスアーキテクチャを組み合わせて、WordPressサイトにエンドツーエンドのデータ暗号化と無制限の拡張性を提供し、世界中どこでも超高速でサービスを提供します。https://www.getshifter.io/日本語版のページもありましたので共有しておきます。(2019.07.31追記)ただLPなのでこのページだけですけど。Shifter(日本語版)WordPressが使える静的サイト生成サービスまだちょっと分かりにくいかもしれませんが、簡単にまとめてしまうと「サイトの情報更新にはWordPressの管理画面が使えるけど、表側(一般の人が見る情報)は静的なHTMLとして提供できるサービス」ということになります。そもそもWordPressは動的サイト向けのCMSです。この「Shifter」と似た動作としては「MovaleType」というCMSがあり、これも管理画面でページの作成を行い、「生成」という作業、記事の一覧を含めた表用のHTMLを生成して、それをみんなに見せるタイプです。MovaleTypeでいいんじゃないの?今さらなんでShifter?という疑問が出てきますが、そこは「これまでのWordPressの資産が活用できる」という1点で今注目を浴びているものと思います。Shifterが話題になっている理由WordPressは全世界的にシェアを拡大したことで、そのノウハウがネット上に溢れています。調べれば大体のやりたい事は、そのやり方を解説したページが見つかります。(言い過ぎですか?)ただ、それでも問題視されている点が2つ。それは安全性と表示速度について。安全性についてWordPressは動的サイトを運用する仕組みで、この「動的サイト」の場合、閲覧者からの要求に応じてサイトの表示を変更したり、様々な機能を提供できます。※ここが「動的」と言われる所以です。逆に「静的サイト」はすでに完成しているHTMLやCSS、JavaScriptの組み合わせをブラウザで計算、表示するだけなので、閲覧者からの要求を受け付けません。この違いにより「動的サイト」では悪意ある閲覧者が、不正な要求をした場合に、それを拒否、排除する仕組みが必要になるのですが、そこに「抜け穴(=セキュリティーホール)」があると、悪意を持って侵入し、害を及ぼされる可能性が出てしまいます。有名なサイト(あのアメリカ合衆国のホワイトハウスのサイトもWordPressです。)でも利用されていることと、オープンソースということが合間って、ハッキング、クラッキングのターゲットになってしまいました。WordPress自体はオープンソースですから無料で利用できますが、そのセキュリティ対策に費用がかかり、リスクと費用を考えると割りに合わないのでは?という意見も出ています。表示速度について「Shifter」は静的サイトを作ってくれるサービスです。「静的サイト」は「動的サイト」より表示速度において優れています。動的サイトでも表示速度を早くする方法はいくつかありますが、最終的には静的サイトと同じような構成に近づきます。Network.詳しい内容はこの辺り参照してください。CDN)も自動でセットアップしてくれるそうなので、表示速度にはかなり期待ができます。「動的サイト」と「静的サイト」の違いを、その仕組みじゃなく、性質として理解していれば私と同じように「??」な状態になると思います。「Shifter」を使ってみる前置きが長くなりましたが、実際に使ってみましょう。お試しなら無料で始められます。サイトは英語版しかないので、英語読めない人はChrome翻訳などで頑張って。アカウントの作成https://go.getshifter.io/registerまずはここからアカウントを作成します。名前、ユーザー名(ログインに使用、あとで変更できません)、メールアドレス、パスワードを入力して「Continue」をクリック。私の場合迷惑メールに分類されてしまって、しばらく気づきませんでした。サイトを立ち上げるメール記載のURLをクリックすると、アカウント作成が完了しますので、先ほど登録したユーザー名かメールアドレスでログインできます。ログインするとこんなメッセージが。「ハッカーからも安全で早くて完全な静的サイトをWordPressで作りますよ。最初のサイトを作ってね」と言ったところでしょうか。New」から新しいサイトの登録から始めます。サイトの登録はサイトの名称(Shifter内ので管理用)入力と管理するチームを選択するだけ。フリーアカウントなので有料プランや独自ドメインのやり方はここでは書いてありません。フリーアカウントの場合、新しく作成したサイトは7日間のみ有効で、その後自動で削除されてしまう様です。新しいサイトが作成されると「Sites」画面にて登録したサイトが選択できますので、サイト毎の管理画面に移動します。サイト閲覧用のURLとサイトのキャプチャ、状態、アーティファクトの状態が確認できます。(「アーティファクト」の解説は後述)このサイトの場合、公開URLは「https://evil-swartz4817.on.getshifter.io」ステータスは「Running」アーティファクトは「まだない」という状態です。この時点で「WordPress」が起動した状態になっています。WordPress」と表示されているのが、起動している状態です。ボタンが表示されます。いざWordPressの管理画面へ隣の「Dashboard」ボタンをクリックしてみます。見慣れたWordPressのダッシュボードが表示されました!(初期状態では「英語」表記になっていますので、お好みで「Settings」から他の言語に変更してください。)この状態になると一般的なWordPressと全く変わりありません。「サイトを表示」するとそのままいつも通りサイトの表側が表示されます。「Shifter」は静的サイトなので、上記画面(投稿)にも書いてありますが、「検索」は動くのか?という疑問が浮かびますが、この画面では動きました。この画面は一般に公開されていません。この状態のURLを見てください。(一部マスクしています。ID」と呼ばれる一意の値が割り当てされています)URLが公開URLとは別物です。ポート番号も一般的なHTTPSではありません。これが「Shifter」の肝となる部分。常にオンになっている静的ページを無制限のスケーラビリティでホストし、必要なときだけオンになる完全管理のコンテナ環境でWordPressを実行します。https://www.getshifter.io/この部分です。この状態はWordPressを一時的な仮想環境で実行しているだけですので、この後「公開」作業が必要になります。割愛し、作業が完了したらShifterの画面に戻ります。一般公開のためにはここで「アーティファクト」を作成する必要があります。assets.ShifterのアーティファクトはあなたのWordPressサイトの静的バージョン(またはビルド)です。それらはHTML、CSS、そして資産としてのあなたのサイトの全体のコピーです。Title」に生成するアーティファクトの名称を入力します。「20190725Shifterの記事アップ版」とか、どの記事が公開されたいつのバージョンか分かる名称が良いです。生成するアーティファクトは履歴として残り、ロールバック(元に戻すこと)もできますので「バージョン1」とか「バージョン20190725」とか何が更新されたのか分からない物はオススメしません。「Generate」ボタンをクリックすると、アーティファクトは生成が始まります。この時WordPressが起動したままだと「アーティファクト生成中はWordPressにアクセスできませんよ」と注意メッセージが出ますが、共同編集などしていない場合は、そのままもう一度「Generate」ボタンクリックで大丈夫です。WordPressが停止し、生成が始まります。Site」になるまで待ちます。Site」をクリックしてみましょう。公開URLにて、先ほどWordPressの画面で見たものと同じ状態が確認できます。テーマがデフォルト「」ですが、さすが静的サイト。データの払い出し速度がTTFBが48.02msと速いですね。静的サイトの初速ちなみにWordPress版の場合TTFBが268.63ms静的サイトの5倍ほど時間が掛かっています。WordPress版の初速さて、ここまでは簡単な「Shifter」の使い方でした。途中「この画面では動きました」と書いた「検索」について。静的サイト版でも試してみます。