WordCamp Tokyo 2018に参加してきました！

初めまして。私は新卒で入社したエンジニアです。いつもはPHPを触ってアプリケーションを作ったり、時にはサーバーをいじったりしています。最近もnginx（サーバを動かすソフトのひとつ）の設定で頭を抱えたりしていました。

最近どうやら「勉強会や技術イベントであれば休んでも構わない」という情報を耳にしまして、だったら「WordCamp行きたいので休ませてください！」とか言っても休めるのかな？と思いお願いしたところ、すぐにオッケーが飛んできました。これはまたとない機会です！

そんなわけでフルでWordCamp Tokyo 2018に参加できたので、今回はその時のレポートをご紹介します。

WordCampって？

WordCampはWordPressを使っている人のためのイベントです。WordPressでブログを書いている方も、インフラから支えている方も、開発者の方も、コミュニティを支えている方も。みんなが一丸となって作っているイベントです。誰でも参加できて貢献ができるWordPressなので、イベントも全ての方が参加できるように様々な配慮がされています。このWordCampはWordPressのことをもっと知ることができて、経験値がいっぱいもらえるイベントなのです。

コントリビュートデイ

コントリビュートデイでは、様々な方法でWordPressに貢献しようという日です。初めての方から上級者まで参加していました。

私はプラグイン開発のチームで黙々と作業して、プラグインにPull Requestを送っていました。（本当に黙々と作業していたのであまり書く内容がありません）

セッションデイ

セッションデイは通常の講演を聞く日です。WordPressに精通した方々の発表を聞くことができます。

PHPの今とこれから 〜WordPressスペシャル版〜 (廣川さん)  

WordPressはPHPで動いているのでPHPの知識があると、もっとWordPressのことを知ることができます。これからのPHPの方向性を知りたいと思ってこのセッションを聞いたのですが、年末にリリースされるPHP7.3ではさらに高速化されるようなので、今までのブログももっと速くできるのではないでしょうか。また、WordPressの推奨環境が徐々に引き上げられており、正しく動く環境をこれから整備していけないと感じました。

• CMSのシェアでWordPressは60%
• PHP 7ユーザは19.4%
• サポート切れになったバージョンを使ってる人は63%
• WordPressはPHP7.2とMySQL5.6とHTTPSが推奨環境である
• 年末にPHP 5系と7.0がサポート終了になるのでみんなもバーションアップしよう！
• 年末にPHP7.3がリリース！
• PHP7はPHP5と比べて2倍も高速化
• PHP7.３はheredocやnowdoc構文が柔軟になり1割高速化
• 現在PHP 7.4の開発がスタートしている
• phpは歯ブラシのようなもの。これは問題を解決するためのシンプルなツール
• もっとコミュニティに参加していこう！

PHPフレームワークから学ぶWordPress運用改善 (寺井さん)  

プラグインはfunctions.phpに書く場合がほとんどですが、そのまま注ぎ足して書いていくと、とても見辛くてメンテナンスの悪いプラグインになってしまいます。そこで、どういう方法でファイルを分割したり関数の名前をつけるべきかを学ぶことができました。ちなみに、僕が入社したときにPHPStormを導入したのですが、入力補完などが大変優秀なので本当にこれはおすすめです！

PHPフレームワークとWordPress

WordPressの利点

• 設置が簡単
• プラグインが豊富
• 簡単な拡張ならfunctionで解決
• フックがいっぱい

CakePHPの利点

• オブジェクト指向
• O/Rマッパー（オブジェクトを扱う感覚でデータベースが扱える）
• MVC（アプリケーションをモデル・ビュー・コントローラーの３つに分ける考え方）

functions.phpだけでやってると…

• 7000行超えたり…
• スパゲティコード誕生の危険
  リファクタリングがかなり難しくなるので本当にやめたほうがいい

MVCアーキテクチャの話

• コードをModel/View/Controllerの3つに分割する考え方
• こうするとコードがスッキリする
• 構造階層で対応するコードが判別できるように
• 複数人開発時に可読性が上がる

コーディング規約

• コメントアウトで変更を残さない！Gitを使おう！
• 関数名はキャメルケースかスネークケース
• 一目でわかる名前をつけよう
• もっと効率的にしたい場合はPHPStormかIntelliJ IDEAを使う

オウンドメディアをより効果的に運営するポイント(桜口さん)  

Tech:Noteというオウンドメディアの編集長によるセッションです。オウンドメディアではWordPressのプラグインといった機能面も重要ですが、何より一番重要なのは、記事を書いている方々だということを再度学習しました。そのためには、チームを効率良く動かす方法が必要なので、自分が相手を信頼しているという気持ちを口頭や文章で相手に伝えることが必要であるということを知りました。

コンテンツについて

• Googleのルールがよく変わって従来の作法が効かないことがしばしば
• フロー型はコンバージョンに結びつきにくい
• ストック型は検索上位にいると長期間コンバージョンに結びつく

必要なものは？

• ライター
• WordPress
• モチベーション

効率的ってどんなこと？

• チームが自走してみんなが自分で動いてる状態
• すぐに否定しない（いうのやめとこうってなる）
• アイデアを採用する（この企画は通るんだ！ってなる)
• ティーチングをする
• 1on1でコーチング
• 自分で目標を設定する
• マイクロマネジメントをしない
• 信頼していることを伝える（口頭でもSlackでもなんでも）
• 一人一人で動けるようにする

WordPressでECサイトを作る実践的な知識と技術【WooCommerce編】 (田中さん)  

そもそもWordPressはCMSなので、ショッピングサイトを動かすのは大丈夫かという不安がありましたが、セキュリティ面や機能面でも問題がないことを知りました。また、普通に販売するだけではなく、顧客を予想したり、誰に向けて売りたいのかなどを考えないと売れないことを知りました。

ECサイトを作る前の準備

• ECサイトで100万売りたいなら1割か2割は広告費に割こう
• 価格競争が激しいものはECに向かない
• ストーリー性があるもの（定期購入とか）や特殊なものは売れる
• ページの読み込みが１秒たつと１割売上が下がる
• 支払いやすさや受け取りやすいところは人気
• クレジット決済を導入すると売上が上がる
• コンビニ決済やキャリア決済が多くなりつつある
• Amazon Payだと住所情報を入力しなくて良いので３割ぐらい上がる。
• GPLを遵守してるならマーケットプレイスでプラグインを販売してもOK。

セキュリティ  

• WooCommerceは自動的にパッチが当たるので他のECサイトよりも安全性が高い
• WooCommerceのセキュリティを上げたいならWordPress Coreのアップデートも上げよう。
• 全部最新版に上げよう！
• ちゃんと最新のコードを書こう
• 継続して開発されているプラグインを使おう
• コアは絶対に触らない
• 親テーマも絶対に触らない
• 定期的なバックアップを必ずとる。DBなら毎日が理想
• ステージングサイトは必須

マーケティング

• お客さんの年齢層も意識しよう
• 検索トレンドを確認しておこう
• SNSでどれくらい注目されているかチェック
• 競合他社がどれくらいいるか
• リピート商品だったらどれくらいリピートするのか
• リピートしない商品ならうまくストーリーを作ってリピートさせるか

環境の用意

• 普通のレンタルサーバーでも全然良い
• 売上100万円超えるならVPSなり専用サーバなり使った方が良いのでは
• 売上10万円超えないならBASEみたいなASP使った方が良い。
• 全部が全部WooCommerseで賄えるわけではない！
• WooCommerceは秒間5オーダーできる能力
  サーバーのチューニングはちゃんとしよう。
  テーマは子テーマで作る（Snow Monkeyも便利！）
  プラグインは6000以上あるので大抵のことなら間に合うかも

スマホファースト

• 今のECサイトはスマホファースト
• 女性なら９割スマホで購入している
• UXやUIを練るとよい

最後に

WooCommerceは開発ビジネスで定期売上やアップセルが期待できる（かも）。

CDNを活用したWeb高速化術とマルチデバイス時代におけるWeb速度の重要性(小川さん)  

今運用しているウェブサイトでもスマホの利用率は高いので、低速回線のことを視野に入れて考えないといけないと感じました。特に月末では通信速度が遅くなるユーザーが多いのでサーバー側で圧縮などを行って訪問客を逃さないよう整備していかなければならないとも思いました。また、PageSpeed Insightはいつも使っているのですが、これでも十分ではないということを新しく知りました。様々なツールを使いこなしてでも高速に表示できるよう工夫していきたいです。

ネットワークの多角化が激しい

• スマホやタブレットをつかって3G/4Gで通信したり
• コンテンツサイズが増える傾向に
• 近年では低速不安定な回線で低スペのデバイスからリッチコンテンツを高速に表示することが求められる。

Googleスピードアップデート

• デスクトップ向けページではなくモバイル向けページの表示速度で判断される
• モバイル向けの表示スピードが重要視
• 遅いウェブサイトは段階的に適用される
• 他のサイトが高速化されると自分のサイトは置いてきぼりにされて適用されるかも…！

Web高速化のやらかしを７割防ぐ方法

• 本当に早くなったかチェックしよう
• GoogleのTest My Siteを使おう
• Web Pagetestも便利
• モニタリングしながら設定を変えて調査しよう

Webが表示されるまでの各工程でとにかく削減や最適化をしよう

• 通信やプロトコルの最適化をしよう
• HTTP/2とか
• TCPの最適化（3-way handshakeはコストが多い）
• QUICも速い

コンテンツサイズを縮小しよう

• 6割ぐらいは画像コンテンツが占めている
• Minifyしたり
• WebPにしたり
• ロスレス圧縮したり
• リサイズしたり

コンテンツを圧縮しよう

• Gzipとか
• Brotliも良い

表示速度を安定化や最適化しよう

• LiteSpeed Cacheなどを使ったコンテンツの縮小
• CDNを活用して高速化する
• 入れて終わりではなくてチューニングもする
• 正しく測定してスタートすること
• フロントエンドもバックエンドも対策が必要

A deep dive into WordPress performance (Mike Rynart)  

ここで学べたのは、本当の速度を上げるのではなく、いかに誤魔化しながら速くするのかという方法。コンテンツの読み込む優先度を事前に決めておき、最初に表示されるコンテンツは最初に読み込んで、それが終ってから後で読み込んでもよいコンテンツを読み込む、などの手段をこなしていくことで体感速度は上がることを知った。コンテンツは「少ないものを送るべき」「小さくして送るべき」「効率的に送るべき」という原則を守ることも重要だと感じました。

どうしてスピードは大事なのか

• 第一印象だから
• みんなせかせかするから速さは求められる
• 2秒以内にロード終わらせたいって思ってる人は2人に1人
• 3秒かかると56%の人が抜けてしまう
• スピードもUXの一つだよね

時は金なり

• 速ければ浮いた時間でいろんな人が長い間見てくれる
• アフィエイトもしている場合はお金に直結することもあるのでは？

便利なツールを使おう

• Page Speed Insigts
• Pingdom
• lighthouse
• 開発ツール
• GTmetrix
• WEBPAGETEST

早く感じるのは大事

• 空港でキャリーバック待つときは長く感じるし
• 遊んでるときは短く感じる
• TTI(Time To Interactive)

３つのルール

• 少ないものを送るべき
• 小さくして送るべき
• 効率的に送るべき

自分の場合を例にすると…

• TTIまで6.5秒も遅かった
• Lighthouseの機能を使って何が遅いのか探った
• 不必要なコードを消した
• ホスティングをアップグレードした
• PHP 7を入れた
• gzip使ってレスポンスタイムを改善
• HTTP/2を使った
• CDNを使った
• 画像をImagifyで圧縮した
• こういったことをした3G回線でも3.8秒に！

トークセッション  

なかなか聞けないレンタルサーバーの会社の叫びを聞くことができたのが何よりも新鮮でした。特に「お試しインストールしたWordPressは放置しないで！」はいつかしてしまいそうなので気をつけようと思いました。レンタルサーバーもよく調べると独自の機能が整っており、これからの選定に非常に役立つ情報となりました。

WordPress Host Test  

• 実際のレンタルサーバーでWordPressをユニットテストをしようという活動

ホスティングコミュニティで期待していることは？  

• 事前にセキュリティ情報が通達されるので、セキュリティを高めたまま最新のWordPressが提供できる

海外のレンタルサーバーはキャッシュ系プラグインを禁止していることも。日本はどうなの？  

• ロリポップ!の場合はコンテンツキャッシュ機能を備えており、WordPress向けにチューニングされている
• さくらは特に制限はないが、サーバー側でバックアップやステージングが使える
• Xserverはキャッシュ機能があり、バックアップは自動でできる

使ってるみんなにお願いは？  

• コアもプラグインもちゃんとアップデートして！
• コントロールパネルを操作するだけで変えられるのでPHP 7にして！
• ステージング環境あるから安心！
• WAFは切らないで！切ったら戻して！
• ログインできないって問い合わせが多いので管理者が変わった時はちゃんと引き継いで！
• インストールウィザードを放置しないで！

他社のレンサバ会社を褒めてみよう  

• XserverはSSD使ってて羨ましい
• さくらはユーザーコミュニティがしっかりしていて、自主的にユーザーが企画やイベントを助け合ってるのがすごい
• ロリポップ!はサービスがユニークで面白い

WordPressの超コアなサポートが欲しい（質疑応答）  

• あなたのデータはお預かりした貴重なデータとして見ている
• 基本的にデータは触らないし触れない

最後に

WordPressを様々な方法で使いこなしている方の発表を聞くことができたので、それぞれがどのように扱っているのか、どんなことに気をつけているのかを知ることができました。その中には共通していることも少なからずあり、WordPressに纏わるすべてのものはきちんと最新版にしておく、ということをほとんどのセッションで言っていたのが印象的でした。

また、年齢層も幅広く、親子向けスペースもあって本当に誰でも参加していたのが特徴的でした。

初めての参加でしたが、どんな人でも楽しめるようになっており、多くの人によってWordPressは成り立っているんだなということを再度実感しました。