シンメトリック公式BLOG
システム開発のノウハウをまとめています

コンテンツ同期は構造変換同期で

ジーンコード(以下、GC)の導入動機は、PCサイトだけを更新すれば、スマホサイトも同期して更新されることです。これにより、運用コストを大幅に節約できます。大きなシステムであればあるほど、このコスト効果は大きくなります。PC&スマホサイトのコンテンツ同期は、この手のサービス・製品の根幹です。そこで、GCがどのようにして同期を実現しているかを解説します。

データ同期を考えるに際しては、3つのケースがあります。

  • 非同期:出力されない。
  • サブツリー同期:指定タグ内がそのまま同期します。テキスト1つのspan要素も、トップ階層のdiv要素も、table要素であっても、そのタグ内部のPCサイトのサブツリーをそのまま出力します。
  • 構造変換同期:入力サブツリーの構造から、所定のデータ(li要素の中だけとか、input要素だけとか)を抽出し、新たなサブツリーを構築して出力します。

GCでは、必要なサブツリーを指定してスマホサイトを構築するので、非同期(不要)部分については明示的な指定をせずに実現できます。前述のBlogエントリーにあるように、不要な要素に対する操作(隠すとか)が不要であるのは再構築方式のメリットであり、サーバーサイドだからこそ実現ができるものです。

GCでは、同期させる方法が2つあります。1つはサブツリー同期であり、PCサイトの必要なサブツリーをそのままスマホに持ってきます。もう1つは、構造変換同期であり、素材データだけを抽出して新たにスマホ用のツリーを構築するものです。

サブツリー同期では、全てをそのまま持ってくるので、その内容がどのように変化しようとも100%同期させることが可能です。当然ながら、タグの構成やデザインについてもPCサイトを踏襲しています。そのまま、スマホとして利用できる場合には問題がありませんが、通常、PCサイトのサブツリーはスマホでそのまま使えることはありません。

なぜなら、PCから取得したサブツリーはPCの画面幅に合わせたピクセル設計やアイコンなどの画像設計、そのタグ構成で動作するCSS設計が施されています。またスマホは通常HTML5で設計しますが、PCサイトは今もHTML4が主流なので、スマホで望まれるデザインにはならないのです。このため、スマホ用デザインの為に、不要な要素を消したり差し替えたりして、スマホ用のツリーに変換することが必要となります。それが大きな問題を引き起こします。

コンテンツ同期

その問題は、更新されるWebページにおいては、同じデザインでも素材データの数やタグ組に微妙な差が発生することに起因します(同じ“カメラ”という商品でも品物によって、写真の数や解説の長さやsalesアイコンの有無などが、異なるでしょう)。要素の消込や差替えの補正プログラムは、汎用化できるケースは稀で、個々作り出す必要があります。このことから、サブツリー同期では、PCサイトが元の構成と異なるとすぐに不具合が起こるような、脆弱な同期しか実現できません。同期しない訳にはいかないので、現実的には、不具合を防ぐために、厳しいルールをPCサイトの運用に持ち込むことになります。

サブツリー同期の問題に対応したのが、構造変換同期で、入力ツリーのデータ構造を解析して素材データを抽出し、PCサイトの構造は捨ててしまいます。解析に当たっては、特定素材データのみを抽出することができ、それ以外のデータは無視(破棄)されます。取り出した素材データは予め設計されたスマホ用のデータ構造に変換して出力します。PCサイトの構造(タグ組だけでなく、属性設定も)はリセットされ、スマホ用の全く新しい構造が与えられるので、スマホ用に個別な調整プログラムを開発する必要がありません。

構造変換同期では、出力構造が決まっていて、その構造に必要な素材データを入力サブツリーから探し出してきます。探索アルゴリズムは、データ構造やデータパターンを想定して組むため、同じ構造を有してさえいれば、数の違いや不要な要素の出現パターンが違っても、必要なデータを見つけ出します。このことは、PCコンテンツの変更自由度を高く保ちながら、高い精度の同期を実現できます。

構造変換同期の、「予め設計されたデータ構造」や「探索アルゴリズム」は、GCパーツと名付けたコンポーネントとして再利用可能な形で提供されています。GCでの変換をする際には、得たい出力パターンのGCパーツを選択し、入力ツリーを与えるだけで完了します。

ジーンコードでは、ほとんどのケースでシンメトリックから提供される豊富なGCパーツを利用して、構造変換同期となる開発をします。これによって、非常に高い同期性を実現したPC→スマホ変換システムを作ることができます。マッチしたGCパーツが無い時には、サーバサイドJavaScriptを用いて実装しますが、これはサブツリー同期となります。

最後に重要なこととして、どのような方式であっても、高い運用性と同期性を確保するためには、PCコンテンツの運用を理解していることが圧倒的に重要です。これこそ、ジーンコードがインハウスで自社開発可能な製品として作られた大きな理由なのです。

Page Top