JavaScriotの記述量について

質問

皆さんは一つのWebサイト制作時には
どの位JavaScriptを記述するのでしょうか？

サイト全体で何行(ステップ数)位記述するのでしょうか？

回答No.3

tenderfeel · ベストアンサー

ちょっと前に趣味で作ったサイト（というかWebアプリ）のjsを数えたら1600行くらいでした。
今作っているのは未完成で400行くらいありました。
つくるもの、ライブラリやフレームワークを使うかどうか、何を使うかでだいぶ左右されますね。

回答No.4

神崎 渉瑠（@taloo）

いわゆるLightboxやメニュー関連はライブラリを使えばほぼ0行ですし、
スライドショー的なものでも、ファイル名やリンクURLなどの設定だけですから20～100行程度と思います。

それ以外で何か書こうと思うと、ネタを作る方が結構大変ではないかと思いますから、
一般的なウェブページなら、（ライブラリ以外の部分で）300～500行も書けば多い方じゃないでしょうか。

http://grupowprojects.com/folicure/ 2000行程度
http://community.saucony.com/kinvara3/ 1300行程度
http://www.mezcalbuenviaje.com/ 700行程度
（行数はライブラリを除く。ともに画像がふんだんに使われているため、かなり重いです。）
こういうタイプのになるとさすがに増えてくると思いますが、
こういうサイトを作るための"スクロールライブラリ"にしてしまえば、数行で書けるようになると思います。

回答No.2

神崎 渉瑠（@taloo）

サイトの規模や製作スタイルにもよりますし、行数やステップ数に意味はないと思います。
行数やステップ数で料金計算をしているような人も居ないんじゃないでしょうか。
スクリプトの代わりにCSSを使えばそれだけで0行、0円になってしまいますから。

増やそうと思えばいくらでも増やせると思いますが、
マジックナンバーを書くか、初期設定（const、C系言語なら#define）として変数に保持しておくかでも、行数は変わると思います。

// constで5行（私はこういう書き方を好みますが）
var ROW_COLOR_EVEN="#000000";
var ROW_COLOR_ODD="#FF0000";
for( var i=0; i<something.length; i++ ){
something[i].style.color=(i%2)?ROW_COLOR_ODD:ROW_COLOR_EVEN;
}

// マジックナンバーで3行（多くのJavaScriptプログラマーがこの書き方を採用していると思います。）
for( var i=0; i<something.length; i++ ){
something[i].style.color=(i%2)?"#FF0000":"000000";
}

// ifを使って7行
for( var i=0; i<something.length; i++ ){
if( i%s !== 0 ){
something[i].style.color="#FF0000";
}else{
something[i].style.color="000000";
}
}

ライブラリを使う場合、そのライブラリ本体を行数に含めるのか、
ライブラリの機能を自分で作った場合はどうなのか、ということでも計算方法は違うと思います。

// Prototype、eachを使って1行
something.each(function(o, idx){o.setStyle({color: (idx%2)?"#FF0000":"000000"});});

// 無名関数を有名関数で書き換えて4行
function styleChange(o, idx){
o.setStyle({color:(idx%2)?"#FF0000":"000000"});
}
something.each(styleChange);

//Prototypeを使わずに自分で記述した場合は、その行数を加算するのか？
Array.prototype.each=function(){

}
Element.prototype.setStyle=function(){

}

回答No.1

babu_baboo

プロのかたの意見はきっと、「金になるなら、なるだけ書く」かもしれません。
素人目（私）からすると、script を多用するサイトほど、「価値のある情報」とは反比例し、ページそのものの寿命が短いと感じます
（伝えたいものが乏しいので見た目でごまかすから……。あっ！これってなんにでもあてはまる？（笑））