お世話になっています。JSPでHTMLを表示するプログラムを作っています。
以下のようなデータを表示しようと思っています。
項目は10個で、以下の通りです。
メーカー名 商品名 伝票日付 取引 伝票No. 数量 金額 JANコード 厚生省コード 薬価
データの件数は、最大1000件あり、お客様の都合上、それを1ページ上に表示しようとしています。
ですから、最大、10項目×1000 のデータを1ページ上に表示したいのです。
まず、表形式で見栄え良くHTMLを作成すると、最大800KBになりました(^^;
軽くするため、
<PRE>
ああああああああああ |ああああああああああああああああああああああああああああああ
|20020125 |ああ |000000 |00,000 |000,000,000 |00000000000 |000000000000 |000,000,000
</PRE>
のように記述すると200KBにおさまりました。
しかし、| の部分でズレが生じます。
ズレを生じさせない、見栄えの良い表形式のもので、軽くする方法があったら教えてください。
よろしくお願いいたします。
No.1
- 回答日時:
ベタ書きなら200KBのところ、800KBは
どう考えても大きすぎるような気がするのですが・・・
単純計算で1セルあたり600バイトをタグなどで使ってる話になります。
そこで確認したいのですが、表のセルごとに
<td bgcolor="#ffffff">
のようなことはしてないですよね。
もし何か属性を使っているなら、colgroupか
CSSのselectorを使って節約できます。
この回答への補足
お返事ありがとうございます。
<td bgcolor="#ffffff">のように背景は指定していません。
ただ、項目の幅を揃えるため、WIDTHは指定してあります。
念のため、下に、1つのTABLEのタグを記述します。
よろしくお願いいたします。
<TABLE bgcolor="#ffd9d9" cellpadding="2" background="../images/td_bg.gif" width="100%">
<TR>
<TD colspan="3">大日本製薬</TD>
<TD colspan="5">アイスコーヒー</TD>
</TR>
<TR>
<TD width="70">20020131</TD>
<TD width="40">売上</TD>
<TD width="80">8888888</TD>
<TD width="60">99,999</TD>
<TD width="70">999,999,999</TD>
<TD width="100">a-00000001126</TD>
<TD width="100">888888888888</TD>
<TD width="70">343,434,343</TD>
</TR>
</TABLE>
No.2
- 回答日時:
sp.gifなど1×1ピクセルの透過GIFを用意して、
先頭で横幅を固定してあげると、それ以降の<td width="xx">などの指定が不要になるので結構サイズ削れると思います。
あとはソース見にくくなりますが、改行もなくすとか
細かいところで削っていくと気休めにはなるかもしれません
<TABLE ・・・・ STYLE="table-layout:fixed">というのはIE限定ですが、テーブルを全部読み終わってからではなく、読みながら表示するための指定です
(詳しくは参考URLをご覧いただけばわかっていただけるかと思います)
<TABLE bgcolor="#ffd9d9" cellpadding="2" background="../images/td_bg.gif" width="100%" STYLE="table-layout:fixed">
<TR>
<TD><img src="sp.gif" width="70" height="1" alt="" border="0"></TD>
<TD><img src="sp.gif" width="40" height="1" alt="" border="0"></TD>
<TD><img src="sp.gif" width="80" height="1" alt="" border="0"></TD>
<TD><img src="sp.gif" width="60" height="1" alt="" border="0"></TD>
<TD><img src="sp.gif" width="70" height="1" alt="" border="0"></TD>
<TD><img src="sp.gif" width="100" height="1" alt="" border="0"></TD>
<TD><img src="sp.gif" width="100" height="1" alt="" border="0"></TD>
<TD><img src="sp.gif" width="70" height="1" alt="" border="0"></TD>
</TR>
<TR>
<TD colspan="3">大日本製薬</TD>
<TD colspan="5">アイスコーヒー</TD>
</TR>
<TR>
<TD>20020131</TD>
<TD>売上</TD>
<TD>8888888</TD>
<TD>99,999</TD>
<TD>999,999,999</TD>
<TD>a-00000001126</TD>
<TD>888888888888</TD>
<TD>343,434,343</TD>
</TR>
</TABLE>
参考URL:http://www.microsoft.com/JAPAN/developer/worksho …
No.3ベストアンサー
- 回答日時:
こんな感じでどうでしょう?
<BODY><TABLE cellpadding="2" background="images/td_bg.gif" width="100%">
<TR bgcolor="#ffd9d9">
<TD colspan="3">大日本製薬</TD>
<TD colspan="5">アイスコーヒー</TD>
</TR>
<TR bgcolor="#ffd9d9">
<TD width="11%">20020131</TD>
<TD width="6%">売上</TD>
<TD width="13%">8888888</TD>
<TD width="10%">99,999</TD>
<TD width="11%">999,999,999</TD>
<TD width="17%">a-00000001126</TD>
<TD width="17%">888888888888</TD>
<TD width="11%">343,434,343</TD>
</TR>
<TR>
<TD colspan="8"> </TD>
</TR>
<TR bgcolor="#ceffff">
<TD colspan="3">小日本製薬</TD>
<TD colspan="5">ホットカフェオレ</TD>
</TR>
<TR bgcolor="#ceffff">
<TD>20020233</TD>
<TD>売上</TD>
<TD>7777777</TD>
<TD>33,333</TD>
<TD>333,333,333</TD>
<TD>b-00000001212</TD>
<TD>777777777777</TD>
<TD>121,212,121</TD>
</TR>
<TR>
<TD colspan="8"> </TD>
</TR>
</TABLE></BODY>
この調子で実際に1000件分作ってみたところ(最後までテーブルは閉じない),333,031 バイトでした。ただし,中に入る字数で多少増減はすると思います。
たぶん,「background="images/td_bg.gif"」はこのとおりにすると必要なくなるかもしれません。
1000件分のデータを表示するのですから,データとデータの間に隙間を設けたくない場合は,
<TR>
<TD colspan="8"> </TD>
</TR>
を削除してください。
確認はIE6でしています。
試してみてください。
お返事が遅くなってしまい、申し訳ありません。
早速、<TD width="17%">のように、一番上の行のTDの幅だけ指定し、
あとの行は指定せずに試してみました。
また、各データに入れていた「background="images/td_bg.gif"」も
削除しましたが、結局1000件で600KBにしかなりませんでした。
始めは800KBだったことを考えると、かなり小さくなりましたが、
これ以上、少しは軽くなっても大きく変えることは出来ないと思い、
お客様に相談し、結局検索結果を複数ページに分けることにしました。
HEADやCSSで約50KBあることと、各データの中身に大小あること他、
原因かと思います。
しかし、ご相談にのっていただき、大変勉強になりました。
ありがとうございました。
お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!
関連するカテゴリからQ&Aを探す
おすすめ情報
- ・漫画をレンタルでお得に読める!
- ・人生のプチ美学を教えてください!!
- ・10秒目をつむったら…
- ・あなたの習慣について教えてください!!
- ・牛、豚、鶏、どれか一つ食べられなくなるとしたら?
- ・【大喜利】【投稿~9/18】 おとぎ話『桃太郎』の知られざるエピソード
- ・街中で見かけて「グッときた人」の思い出
- ・「一気に最後まで読んだ」本、教えて下さい!
- ・幼稚園時代「何組」でしたか?
- ・激凹みから立ち直る方法
- ・1つだけ過去を変えられるとしたら?
- ・【あるあるbot連動企画】あるあるbotに投稿したけど採用されなかったあるある募集
- ・【あるあるbot連動企画】フォロワー20万人のアカウントであなたのあるあるを披露してみませんか?
- ・映画のエンドロール観る派?観ない派?
- ・海外旅行から帰ってきたら、まず何を食べる?
- ・誕生日にもらった意外なもの
- ・天使と悪魔選手権
- ・ちょっと先の未来クイズ第2問
- ・【大喜利】【投稿~9/7】 ロボットの住む世界で流行ってる罰ゲームとは?
- ・推しミネラルウォーターはありますか?
- ・都道府県穴埋めゲーム
- ・この人頭いいなと思ったエピソード
- ・準・究極の選択
デイリーランキングこのカテゴリの人気デイリーQ&Aランキング
-
画像をクリックして元に戻すには
-
リンクを知らせる手のマークが...
-
table で画像をピッタリとくっ...
-
IE7だけに出る謎の空白(CSS)...
-
スタイルシートでフレーム枠を...
-
ポップアップウィンドウのサイ...
-
機種依存文字、m2(平方メート...
-
ボタンをセル内一杯に表示させ...
-
画像にリンクをはって枠をつけ...
-
CSSでボックスの位置を変えたと...
-
favicon.ico はもういらない?
-
3つの画像を中央に寄せて表示さ...
-
htmlの文字が縦書きになる
-
リストマーカーをボックス内に...
-
smallにtext-allignが効かない
-
【ヒトの神秘】美男美女から何...
-
CSSで背景画像を一番下にもって...
-
form input テキストを上下中央...
-
HTML属性での「""」 「''」違い
-
ワードにコピペ、画像が表示さ...
マンスリーランキングこのカテゴリの人気マンスリーQ&Aランキング
-
リンクを知らせる手のマークが...
-
ボタンをセル内一杯に表示させ...
-
HTMLのIMAGEに。。
-
inputタグでサーバにデータを送...
-
UDP通信を使うチャットプログラ...
-
画像の場合のみ、下線を消す方...
-
画像のサイズが変わらない
-
機種依存文字、m2(平方メート...
-
XML画像データををHTMLで簡単に...
-
画像をクリックして元に戻すには
-
Dreamweaverで画像⇔画像のアン...
-
favicon.ico はもういらない?
-
cssで、チェックボックスの画像...
-
下記が私のHPのタグなのですが
-
同一URLの連続アクセス方法
-
アップロードするとレイアウト...
-
HTMLタグのDL DT DDを使ってli...
-
ルートパスの動作確認
-
htmlで画像を2個ずつ並べていき...
-
画像リンクの周りに線が出ます
おすすめ情報