重複したスタイルシートについて

Question

お世話になります。

jspでページ内で繰り返し使用することを想定した汎用的なカスタムタグを作成しようとしています。
その際に処理の中でスタイルシートを使用したいのですが、ページ内で繰りかえし使用するタグの為、タグ内に宣言するとスタイルシートの宣言が重複してしまいます。
この場合、処理が遅くなるなど悪影響はありますでしょうか。
また悪影響が出る場合、どのように実装するのが正なのでしょうか。
(カスタムタグを使用する際は「タグを使用する前に～.cssを宣言する」のように説明、運用するべきなのでしょうか。)

cssファイルは100行の記載に満たない想定、ページ内でタグを100回ぐらい使いまわす想定です。

↓↓↓↓↓↓↓↓↓↓以下、追記↓↓↓↓↓↓↓↓
また、jspタグの実装方法は下記のとおりです。

1.タグの属性に渡された値を元に動的にアイテムを作成する。
2.ある値が条件式に当てはまるなら、classを変更してその部分の表示を変える(ここでcssを使用する。)

より具体的に申し上げますと、属性にタグのクラス名を記載すると、対応して表示位置が左上になったり中央になったりと柔軟にcssを変更されて欲しいのです。
また、他のタグには適用しにくい指定(position:absoluteを使用)の為、そのタグでしかそのクラス名(タグ属性)は使用しません。

追記していたら、条件分岐で各個、直接style属性に指定した要素を表示させるのが良い気がしてきました。
しかし、何回も繰り返されるタグですので、スマートでない気もします。
何か他に良い方法はございますでしょうか。

Answer 1

css自体は一度定義してしまえば良いので繰り返し処理のなかに入れるメリットは一切ありません。
何度も読み込むのでその分の負荷はもちろんかかります。
単にcssファイルに外だししhead内で読み込ませるだけで済むように思いますが、どのような実装にしようとされているのでしょうか？

jspに組み込む前に完全静的htmlで作ってみて(いわゆる「モック」ですね)、レイアウト確定させてから組み込んだほうが切り分けがやりやすくなります。

Comments

[makosankibu]

回答ありがとうございます。
>単にcssファイルに外だししhead内で読み込ませるだけで済むように思いますが、どのような実装にしようとされているのでしょうか？
→タグに渡された値を元に、動的にアイテムを作成し、ある値が条件式に当てはまるなら、classを変更してその部分の表示を変える(ここでcssを使用する。)といった実装です。

完全静的htmlで作成してみるというのは何となくやっていましたが、その概念に名称があるのですね!
大変勉強になります。
レイアウトについては今回は大体出来ています。

[makosankibu]

>単にcssファイルに外だししhead内で読み込ませるだけで済むように思いますが
→この部分について返信できてませんでした。
メンテナンスなどを考えたときに質問文にある「カスタムタグを使用する際は「タグを使用する前に～.cssを宣言する」のように説明、運用するべきなのでしょうか。」という疑問になっています。
ただ、タグを使用する際に一手間かかっているので、それ以外での実装方法（例えば、ページ内で最初の読み込みでしか動作しないような仕組み等）はないかと思い質問致しました。

Answer 2

ページ内でタグを100回ぐらい使いまわす

繰り返し同じスタイルを適用し、他の要素で一切使わないのであれば、style属性に直接書いても構いませんが、他のタグでも適用するのであればスタイルシート用の定義ファイル(CSS定義ファイル)に書くべきでしょう。

カスタムタグないしはJSPタグが直接クラスを出力するのではなく、利用しているタグから属性を設定できるように定義を作っておくのが理想的です。

Comments

[makosankibu]

回答ありがとうございます。
質問文に追記いたしました。お目通しのほど、よろしくお願いいたします。

>他のタグでも適用するのであればスタイルシート用の定義ファイル(CSS定義ファイル)に書くべきでしょう。
→利用しているタグとは、何のことなのかわかりません...
ご説明いただいてもよろしいでしょうか。

[A-pZ]

例えば、<custom:display> の名前でタグを作成して、エラー時と処理成功時で出力するクラスを切り替えるなら、
<custom:display errorCssClass="error" successCssClass="success"> など固定値でも良いですし、<custom:display errorCssClass="${someValue}" successCssClass="${otherValue}"> などでしょうか

[makosankibu]

説明ありがとうございます。理解しました。
> カスタムタグないしはJSPタグが直接クラスを出力するのではなく、...
追記にもありますようにタグを使用するjsp側でクラスを属性で指定するというのは前提にあるので、
つまりは、ページ側のjspで使用するクラスのcssは指定するべきということでしょうか。
```ページ側jsp
<style>.hoge {width:100%}</style>
<custom:display hogeClass="hoge" />
```

Answer 3

cssをjspファイルで読み込ませ、tag内ではクラスのみを変えるようにしました。
回答がつかないのと、この方法で現状の問題はいったんは解決できたので、自己解決といたします。