- ベストアンサー
大量のデータを表として展開する上で
多量の行数の表を展開すると時間がかかります。 そこで数十行ずつ時間をおいて追加しているのですが 元のデータを得るのは、一度で行っています。 そこでお聞きしたいのですが、百戦錬磨の経験者の皆様は データを得るために分割でクエリーを発行していますか? 目的はもちろん見た目の速度アップです。 なんとなくそこまでやるのは無駄なような気がして・・ それと多量のデータを表を展開するまで蓄えておくのが気になっています ajaxのライブラリはhttp://jsgt.org/lib/ajax/ref.htmを使ってます <html> <body> <form> SQL:<input type="button" value="Send SQL" onClick="sendMySQL(document.getElementById('sql').value)"><br> <textarea id="sql" cols="50" rows="10"></textarea> </form> <hr> <table border="1"><tbody id="t"></tbody></table> <script src = "jslb_ajax.js" charset= "utf-8"></script> <script> var hyo=[]; var login={ host:'localhost', user:'root', pass:'xxxx' } function sendMySQL( sql ){ login.cmnd = sql; sendRequest( viewTable, login, 'POST', './sql.php', true, true ); } function viewTable(o){ var dat = o.responseText; delNodes('t'); if(!dat) return; hyo = dat.split('\x1e'); appendTable('t'); } function appendTable( table ){ for(var i=0; i<30; i++){ if(hyo.length == 0) return; var tdList = hyo.shift().split('\x1f'); var trNode = document.createElement('tr'); for(j=0; j<tdList.length; j++){ var tdNode = document.createElement('td'); tdNode.appendChild( document.createTextNode(tdList[j])); trNode.appendChild( tdNode ); } document.getElementById(table).appendChild(trNode); } setTimeout("appendTable('"+table+"')",100); } function delNodes(s){var o=document.getElementById(s);while(o.hasChildNodes())o.removeChild(o.lastChild)} </script> </body> </html> <?php //mb_language( 'Japanese' ); //header ("Content-Type: text/html; charset=utf-8"); //define( '_CHAR_CODE', 'UTF-8'); //mb_internal_encoding( _CHAR_CODE ); //mb_http_output( _CHAR_CODE ); //ob_start( 'mb_output_handler'); //if( strpos( $_SERVER[ 'HTTP_REFERER' ], "url" )!==0) exit; $d = mysql_connect( $_POST['host'], $_POST['user'], $_POST['pass'] ); if(!$d) exit; if(!$rt=mysql_query($_POST['cmnd'], $d)) exit(mysql_error($d)); $b=''; while( $r = mysql_fetch_array($rt, MYSQL_NUM)) $b[]=join("\x1f",$r); echo trim(join("\x1e",$b));
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
基本的に分割しています。(基本的に=つまり例外もある) 1回にダウンロードする内容は、 Ajaxを使わずにCGIだけでHTMLを出力している場合や、Dreamweaverなどで静的なHTMLファイルを作るときに表示する内容、 その1ページ分のみですね。 スタンダードというのはないと思いますが、 要は、1ページの中に何件表示すれば読みやすくなるか、というそれだけだと思います。 >ANo.1 補足 懸念されているとおり、巨大なページはPCのメモリ消費、表示処理にも影響します。 1000行をダウンロードしても読まなければ、それこそ不要なダウンロード、負荷になりますしね。 しかしながら、スクリプトを見る限りでは、 数千行でも1度に表示する方が良いかもしれません。 表計算ソフトでは、最大数万件まで表示可能になっていますが、 そのような内容であれば、1000件や全件表示にする方が良いこともあると思います。 innerHTMLで一気に書き出した方が表示が早いことは確かですし、 このサイズになると'<table>〜</table>'という文字列を生成して、<div>のinnerHTMLに放り込む、 または、むしろJavaScriptを使わずにインラインフレームで表示する、という方法も一考かと思います。 >ANo.2 CSVをJavaScriptで分割するよりも、JSONで受け取ってevalする方がはるかに早いです。 ですので、CSVで受け取ってsplitするよりも、 PHP側であらかじめJSON(配列)で記述しておき、eval(o.responseText)とする方が早いですが、 なかにはevalは邪道だとかいう話もありますけどね(^^; コードがあまりにも単純すぎて素人っぽく見えるので嫌われるんでしょうかねぇ? 不正なデータの場合、いきなりスクリプトエラーが発生するという問題がありますが、 私は良いと思いますけど。 今思えば、これで逃げられるかなぁ。試してません。 try{ eval(o.responseText); }catch(e){ alert('error'); }
その他の回答 (2)
- t_netbug
- ベストアンサー率34% (15/44)
#1です! 数千行…。だったら分けた方が良いと思います。 >それは例えばPHPでSQLのデータを受け取り、それを分割にしてファイルに書き込んで置き、それを順番にjavascript側で読み込むと言う意味ですか? ですです。ただ、こちらもeval関数通すので速度的にどうなの?という問題もあるかも知れませんが…。 数千のデータを扱うのはまだやった事がないので、手に負えないと思ってちょっと調べてみました。 参考URLに記載されたサンプルはいかがでしょう? ハウツーでphp側の処理も書いているので使える部分だけ使えば良いと思います。。。 役に立てなくてスイマセン><
お礼
あっ!お礼を言うのを忘れてました。 ありがとうございます!
補足
サンプル見ましたが・・・・という感じかな? でも今は他にすることがあるので詳しくはのちほど。 ちょっと現在。タイトルとは違うので詳しい話は省きますが http://journal.mycom.co.jp/news/2008/10/07/019/index.html にAjaxのセキュリティーについて書いてあったので 勉強してました。というかこれだけではわかりませんが^^;
- t_netbug
- ベストアンサー率34% (15/44)
百戦錬磨ではなく、プログラム歴半月の経験者(新米)ですが。 自分なら一括で落としてしまいます。 分割で落とすような処理を実現させるのに時間がかからないなら有だと思いますけど。 >それと多量のデータを表を展開するまで蓄えておくのが気になっています メモリに貯めると重くなると懸念しての事でしょうか? javascriptの配列を吐き出すphpファイルを呼び出す方法があったと思います。 ↓こんなの <script type="text/javascript" src="/query_result.php?sess=****&id=1"></script> ajaxで同じようにリクエストを送り、戻ってきたデータをeval関数に流すとか駄目でしょうか? 解決になってないですかね・・・。 お役に立てないと思いますが、とりあえず書いてみました。 駄目な点があれば遠慮なく小突いてください。 勉強になるので。
補足
現在自分の環境では速度的に問題はないのですが、遅い回線の場合 数千行のデータを転送するだけで時間がかかります。 正直なところ分割するかどうかは回線の速度で決めると思っています。 ただ、一般的にはどうするのかなぁ~と思いまして・・・ それからJavascriptの配列を吐き出すってJson形式ですか? あれは速度的に満足できなくてだめでした! phpでファイルを呼び出すとは? それは例えばPHPでSQLのデータを受け取り、それを分割にしてファイルに書き込んで置き、それを順番にjavascript側で読み込むと言う意味ですか? 提示したサンプルは、hyo の変数を shiftしながらデータがなくなるまで削っていきます。 それと平行して hyoにデータを追加するだけで(分割して)可能なのです。なのでバッファとして使い、規定の量を超えないように読み込んでいくのが一般的なのか、その辺が「今のスタンダード」なのか知りたいです
お礼
回答有難うございます^^; 分割で処理するほうに、進みます。 たしかに使いもしない千行は無駄になるかもしれませんしね~ 最初に画面に表示されるのが30行程度ですから、まずはそれを 処理してから、次へとすることにします 最初の頃は、innerHTMLで一気に展開していました。 しかし、徐々に追加されていく(見た目ね)様子を他人に見せるのが 自慢になっていたりして・・・ なので、普通の人ができないnodeでの追加。 そしてevalを使わない処理!をしてました。(見栄か?) なんだかevalは否定はしませんが邪道なような気がしています。 使ってみると便利なのですが、try & catch もその部類な気がしてます なんだか抽象的な質問にお付き合い頂きましてありがとうございました!