---

あけましておめでとうございます。今年は実りある一年になるといいですね。



そんなことはさておき恐らく最大の難関である遅延ロードについて触れてみることにします。
今回は導入として、基本思想を垂れ流します。



twitterのシステムを模倣するにあたり、何としてでも実装しなければならないのはこの遅延ロードです。
下にスクロールしたら新しく読み込まれる･･････ってやつですね。あれをページネーションでするのは流石に宜しくないのです。


この遅延ロードを実装しないとどうなるかを考えた時、将来的に1億を超えるようなデータを表示するハメになりますよね。別に時間が経ったら消去とかしませんもん。
まぁこんなのはプログラムに詳しくない人でもそんなページあってたまるかと思いますよね。そうです。あり得ません。


ただ、動的に読みこむって一言で言っても割ときついんですよ。
フレームワークとどう融合させたらええねんっていう話がまずつきまといます。ビューで見た目を表現したいものの、一旦表示させたページにphpを読みこませるとはどうしたものか、と。

phpが使えないなら全部javascript化する必要があるということですね。動的にブラウザに書き込ませるには、どう足掻いてもjavascriptに頼らざるを得ません。phpは仕組み上遅延ロードなんて存在できませんからね。


しかし問題はそれだけではありません。一般的にjavascriptからデータベースへの接続は出来ません。
出来ないことはないのですが、まぁ色々な理由で使わないほうが良いです。セキュリティ的な意味でも、ブラウザ依存性的な意味でも。

ただ、javascriptを中継して、外部からデータを取ってくる･･････ということは絶対に必要で、ビューもjavascriptで定義しなければいけなさそうですね。


つまり、全体像としてはこうです。


1.スクロールが規定位置に達したら、データベース接続を行うサーバーサイドプログラムを呼び出すjavascriptを何らかの引数をつけて実行
2.データベースから結果を受け取り、それをjavascriptに流す
3.受け取ったデータ(恐らく配列)を用いて新たにhtmlにappendする。


恐らくこういう流れになるハズです。1はAjax(非同期通信)というものを用いて実装します。これを用いることで画面遷移なしでデータのやり取りができるわけですね。
1と2の流れは、恐らくjavascriptから外部のphpを実行しその結果をechoするという流れになりそうです。なりそうってだけで断言できませんが、一応そういうモチーフを考えておきましょう。

ただ、直接実行することができないので、ここでAjaxというものを使うわけですね。


1のサーバーサイドプログラムに関してはphp一択ですね。僕はそれしか扱えません。
javascriptからphpを呼び出すことが可能で、その実行結果をechoするとjavascriptで受け取れ表示できるので、オプションとなる引数をgetパラメータでいくつか渡し、それを用いてデータベースからデータを引っ張ってくる形になりそうですね。
ただしjavascriptということで、いくらでもデータが偽造できるので、例えば他人のメッセージボックスを覗くとかそんなことができないように考慮しなければなりません。
しかもLaravel(のシステム)から外れて自分で実装する羽目になってしまった場合、ちゃんと認証されているかどうかのカラムをデータベースに新たに定義しなくてはいけないなどの問題があります。
ただこの方法が一番現実的ですね。


ちなみに、javascriptありきで実装していますがjavascriptをoffにするとこの機能は使えないのでページネーションのような形でする必要があります。
これはtwitterでも同様でして、javascriptをoffにするとモバイル版のパージに飛ばされます。これどうやって実装しているんでしょうね。調べたらすぐ出てきそうですけど。



とりあえず、javascriptからphpをパラメータ付きで呼び出し、データベースに接続した結果をHTMLを出力させるプログラムをが求められるわけですね。
いきなり全部作るのは厳しいので、とりあえず[PHP, JS]jQueryのAjaxによるPHP、Javascript間の送受信(JSON)というページでも参考にしながら作ってみましょうか。


というのを書こうと思ったんですがなかなか上手く動かないので次回に回します。