2024年2月24日土曜日

WordCamp Kansai 2024 セッションデイ(2日目)に参加して #wckansai #WordCamp

WordCamp Kansai 2024の2日目は、セッションデイです。昨日のコントリビューターデイについては下記のブログを参考にしてみてください。


Photo by WordCamp Kansai 2024: https://twitter.com/WCKansai/status/1762443015900270719


本日、午前中は海を見たい!という気持ちになって、三ノ宮の商店街、三宮神社、メリケンパークへと散策しました。その時のことは、本ブログの一番最後に紹介します。

そういえば、WordPress 関連で神戸に訪れたのは、WordCamp Kansai 2014のキックオフミーティング & WordBench神戸(現在の WordPress Meetup の前身となる勉強会)のときだったのですねぇ。

以下、セッションに関しては筆者が理解した内容の備忘録です。
そのため実際の発表者と意図しない内容になっている可能性があることをご留意ください。
# は筆者の感想的な内容になります。

セッションの動画配信


下記にて公開されています。

Japan WordPress Community (YouTube) - 部屋ごと

WordCamp TV - 個別

発見した参加者のブログ


公式サイト(2024-02-27追加)
あとから X の #wckansai をチェックしていて見つけた参加ブログで気付いたものをリストアップしておきます(2024-02-25ぐらいまで)。

スポンサーブース



昼過ぎに訪れました。昼からのセッションの少し前でしたが、それなりに賑わっていました。

LINE公式アカウント&WordPressで更新頻度が上がった話




椅子に座りきれないほどの人数が参加していました(50名以上)

LINE の Messaging API よりデータをとってきて、カスタムフィールドのデータを更新している。WordPress にログインして更新するということは、なかなか一般の人はやってくれない。しかし LINE での更新はかなりの確率でやってくれる。

お茶会スペース 純喫茶わぷ~(情報交換スペース)




昨日のコントリビューターデイに引き続きお茶会で提供される紅茶などは L'ATERIER DISCIPLE DU BONHEUR からわざわざ来られて紅茶など飲み物を準備されていました。

あとは運営からの提供されたお菓子を食べながら、初めてお会いする方々と楽しく歓談しました。

ブロックエディタでWebサイトの制作がどうかわったのか?実装事例から見る現在のWordPressの設計と構築



ブロックエディターが出てから 5年がでて、当時で始めた WordCamp Osaka 2019 のときにも、ブロックエディターをつかって制作しているかという質問をするとほとんど手が上がらなかった。今回はちらほらとでている。とはいえ、会場の状況をみるとまだまだ浸透まではしていなさそう。
クラシックエディタのほうは制作フローの過程が多くあった。
  1. 静的HTMLを先に制作
  2. 先に制作したHTMLをもとにテーマを作成
変更・追加が管理画面からできないこと、管理画面と全然見た目が異なる、リニューアル時にも同じ構成が必要。

顧客側は入力を限定(カスタムフィールドなどで)させることでデザインに影響がないようにしたのはよかったが、その結果、制作にかかる負担が増加していた。

いまの ブロックエディター構成前提の場合、
  1. 事前に HTMLコーディングはしない
  2. どの構成を使うかの検討
  3. 構成単位で制作
  4. 入力
サイト全体を管理画面から変更できる

構成の分解が必要
「ブロックスタイル」「ブロックパターン」「ブロック開発」「プラグイン利用」「テンプレート」など

#再利用ブロックは、いつのまにか「同期ブロック」と名称変更になってた。

いまは設計が大事。サイト全体でどのようなパターンがあるのか、どのようなブロックが必要。それは運用するスキルも踏まえて考える必要あり。どういう入力がありえるのかなど。

実装工数がかかることはある
レスポンシブ周り(PCとスマートフォンなどの余白とか)

ブロックエディターになってくると、ページ数での費用ではなくブロック数での費用に変えていく必要がありそう。

質疑応答
  • 質問:作り始まる前に、顧客から触りたいという要望があるのか、それとも触るように構成しておくのか
    • 回答:後から触りたいという要望が出てくることを想定している(顧客の「絶対に触りません」は参考にしない。

WordPressサイトに関わるキャッシュを理解する



キャッシュはウェブサイトを早くすると思っていた。ただし大規模サイトを手掛けていると、そうした理解はうまくいかない(キャッシュが効きすぎるなど)場合がでてくる。

キャッシュとは、サイトの閲覧をする場合、表示に必要なデータを毎回計算して表示する場合があり(#WordPress などHTMLを動的生成するもの含む)、そうした場合、再利用したほうが速くならないかというために作られた仕組み。

キャッシュはレスポンスに対する応答が速くなるが、しかし根本解決にはならない。たとえはサイトそのものを表示するプロセスが速くなるわけでないため。たとえば動的にサイトを構成するのに3分かかる場合、キャッシュによって事前に表示データを用意することで速くする仕組みのため。そしてキャッシュについては、その管理する仕組みも必要になり、それが設計をややこしくもなる。
#補足:たとえば事前用意したデータ(キャッシュデータ)と、最新データが異なる場合には、事前に用意したデータを一旦破棄して新しく作り直す必要がある。そこは時間がかかってしまうということ、またそのチェックが必要になる。

キャッシュはいろいろある。CDNキャッシュ、サーバー側キャッシュ(ページキャッシュ等)、PHPキャッシュ、WordPress コアキャッシュ、ブラウザキャッシュなど。これらを把握しないと適切にキャッシュを使えない可能性がある。

また相当処理が重いことをするのにキャッシュを使う場合、事前にそれをすることになるのでサーバー負荷が大きくなってしまいサーバーがダウンしてしまう可能性もある。

下記などをキーワードに考えていく必要あり
  1. オリジンサーバーの内か外か(外はネットワーク上)
  2. キャッシングされるデータの粒度は大きいか、小さいか
  3. インフラ側のキャッシュか、WordPress 上のキャッシュか、あるいは独自のものか
  4. プラグイン等のキャッシュ機能があるものは、何のキャッシュなのか
また、キャッシュについて少し深堀りすると
  1. HTTP キャッシュ(ネットワーク)- CDN、ブラウザ、プロキシサーバーなど
     あれ?更新したのに、ブラウザ上で更新されていないという感じ
     何秒経ったかで古い、新しいを判定している(HTTPレスポンスのCache-Controlフィールドで指示。正確には指示要請するレベルで、実際にはどこかで上書きされる可能性あり)。ウェブシステム(apacheやnginx)に対する設定(PHP側ですることもあり)となる。プラグインで実装されている場合には apache の .htaccess に書き込んでいるだけということになる。
  2. ページキャッシュ
     WordPress は毎回動的にHTMLページを作成している。これをあらかじめ作っておこうというもの。粒度が大きいので効果が大きい。CDNはインフラ部分でしていることになる。CDNとのやり取りをするために専用プラグインをインストールするケースもある。プラグインだけで実装しているなら、プラグインで制御するので高速化できるのは一部にすぎない。
     キャッシュするとNGのケースがある。ログインしているページ(会員サイトや管理画面)がキャッシュされると、ログインせずに誰でもアクセスされてしまう。
    #誰かログインできる人がアクセスすると、そのページが生成されるため
    大抵は管理画面にアクセスするURLをキャッシュの対象外にしている。しかしログインURLが変更するようなケースだと事故が起こる可能性があるので注意が必要。
     独自実装しているケースの場合、特定キャッシュだけするようできるものがよく、どれをつかうか考える必要がある。
  3. WPオブジェクトキャッシュ&永続化
     WordPressコアに実装されている。これはメモリに保存される。メモリは利用し終わると破棄される仕組み。そこで永続化が必要になる。これはデータベースへの問い合わせ(クエリ)について WordPress はサイトへのアクセスがあると毎回しているが、ここをメモリに保存させて永続化させることで、同じ問い合わせについては、すでに問い合わせてメモリにいれたデータを再利用する仕組み。
     WP_Object_Cache 関数をつかうことで使うことができる。使えると効果は大きいが難しい。またインフラ側が対応している必要あり。APCu、Memcached、Redis等。
    #インフラ側にそうした機能があるなら、これらを使うことができるプラグインもある。
以上のようにキャッシュは深堀りすると沼にハマっていく。しかしながら、キャッシュの大筋についての少しずつ実践の中で学んでいくと助けになっていくだろう。

ユーザー行動の分析から、サイトの改善ポイントを探ろう




#最後あたりで参加。そのため、細かな内容はわからず。キーワードだけ拾ったので、また後で調べてみることにする。

Microsoft Clarity を使ってみよう!
====
#翌日インストールしてみました。WordPress でのインストール方法については、下記が参考になりました。
無料ヒートマップ Microsoft Clarity を WordPress で使おう | サーバー総研


Clarity の Clarity tour にある See live demo をみると Users overview がでてきました。実際にどのように活用するかは、このセッションの動画や資料が後日公開された後に、じっくり見ることにします。
===

ChatGPT との議論。定量分析も合わせてしておくのがよい。

ただし、個人情報の保護の観点からは、Google Analytics 4や Microsoft Clarity を使わない選択肢もある。

質疑応答は、発表者の意向により、まずは隣の人となにか1つ聞いてみたいことについて話し合うというユニークな形式になった。私自身は隣がいないことと、最後あたりの参加のために状況がよくわからなかったので傍観のみ。

質疑応答

質問:どの程度のタイムスパンで検証したらよいのか
回答:目的によってしまう。ECサイト等の場合にはデータが変わっていくため、毎日みたほうがいいでしょう。3日や1週間で上がり始めたなと思ったら見なくなるとか。落ちたらアラートが来たりするのでそのときにみるとかもある。しかし基本的には最初は毎日みて、普段がどのような推移になっているのか、そもそもデータが取れているのか(取れていない場合もある)をチェックしたほうがいい。あとは定点観測でいいのではないかと思う。

質問:異常値はどのように捉えたらいいか
回答:自分の中での異常値を考えておく必要あり。大体異常値はスパムと思っていいでしょう。Microsoft Clarityの場合、異常値が Botかどうか分かる。そしてこのツールの場合には、 Botを除去できない課題はある。異常値の場合には一日ずっとあがる。

質問:個人情報を取得しないようにするには(確認画面とか)
回答:スライドに対処方法のリンクを書いている
#「Microsoft Clarity(クラリティ)のデメリット(リスク)と対処法」かな

閉会式




長いようであっという間だった WordCamp Kansai 2024 も閉会式となりました。
WordPress Meetup がたくさんあるので、そうしたものに参加してみて!というお話があった

アフターパーティ



会場設営のためスポンサーブースで待機。その間、スポンサーブースでプチ飲み会が始まりました!ドリンクサーバーの方がいて、どのような飲みものがほしいのか尋ねると、おすすめのものをいってくれます。筆者は少し甘めのビールはないかと訪ねたところ、Hazy IPAを進められました。フルーティで非常に飲みやすかったです!


次に飲んだのが、高価なビールはなにか?ときいて指定されたビール
THE ALCHEMIST Focal Bangerですね。1缶で2000円超えのビールです。


こちらも苦みが薄くて飲みやすいビールでした!また歓談する中で、奈良からこられた親子で来ている方とお話する機会があり、お子様は大学1年生工学部とか。初めて訪れた海外がギリシャだったとか。「若いうちから海外を経験するのはいいことだよ〜」など楽しく歓談できました。また知人にも出会ったので、少し仕事上での課題について話し合ったりしました。


そうこうしている内にパーティの準備ができたので会場へ。実行委員長の短い挨拶を聞きながら、ローストビーフやその他いろいろな準備された豪華な料理を楽しみつつ、歓談できたのでした。やはりイベントは対面はいいですね!


散策(海をみたい!)


さて、せっかく神戸にきたのだから海を見に行こうと思いました。そこで実行委員長には大変心苦しいのですが、開会式の間に少し三ノ宮周辺を散策してました。そのときの体験を紹介します。

神戸三宮センター街




神戸三宮センター街は、10時台はまだ店舗も空いていないところが多く、閑散としていました。昼近くになると上の写真のようにかなり混雑していました。


ぶらぶらと散策しつつ、生田神社一の鳥居を南に通り抜けて三宮神社へ。

三宮神社




裏門からはいって参拝。表門から抜けてメリケンパークまで歩きました。

メリケンパーク




メリケンパークにいく途上に歩道橋があります。久しぶりの歩道橋、その上からみた道路もまっすぐに伸びていて見ごたえがありました。メリケンパーク前に、「メリケン地蔵尊」が鎮座していました。海でなくなった方々のための慰霊のために昭和50年頃に安置されたとか(産経新聞


さてメリケンパークについたわけですが、この近くにあるホテルオークラ神戸は、かなり前に家族と泊まったことがありました。私にとっては、ついて「観光に行くぞ!」とおもって、ホテルをでた直後に、つまずいてひっくり返って足を捻挫して歩けなくなって、一人だけホテルで休んで痛みに耐えていたという痛い出来事がありました。となると、リベンジしないとですね!ということで、あまり時間はありませんが、少し海を堪能することにしました。


50 MPモード(上記は 37.5 MP)で撮影した写真。太陽光が海に反射して輝いているのは非常に心が和みました。 

昼食



いくつか行きたい店があったのですが、混んでいたり、ランチをしていなかったりして機会に恵まれませんでした。時間もなくなってきたので、再び神戸三ノ宮センター街に戻って、サンプラザの地下にて、牛カツを食べました。


やはり神戸に来たなら、神戸牛を食べないとですね! 小さくきってあるレアの牛カツは、かみごたえはあるものの、柔らかくて美味しかったです!

2024年2月24日 @kimipooh

0 件のコメント:

コメントを投稿