memo.xight.org - 2006-08-22

2006-08-22 Tue

CSS圧縮サービス色々と比較

- Summary
以下の6つのサイトを使って，CSS圧縮サービスのIcey Compressor, Clean CSS[2006-06-19-17], CSS Optimiser, Flumpcakesを比較．

Digg.com
Slashdot
Filmsy
iBegin
Download.com
ESPN

- 結果

Site CSS Optimiser Icey Compressor Flumpcakes Clean CSS
Digg.com failed failed failed 16.8%
Slashdot 17.45% 51.21% 9% 21.9%
Filmsy 18.85% 47.08% 17% 29.1%
iBegin failed 55.95% failed failed
Download.com failed 45.49% 0% 27.9%
ESPN failed 69.84% failed 27.9%
Average: 18.15% 53.91% 8.67% 24.18%

- 順位
1. Icey Compressor
2. Clean CSS
3. CSS Optimiser
4. Flumpcakes

- 重要なポイント
・圧縮率の高さ
・再現性の高さ

整形・圧縮をかけた結果，元の表示と違ってしまうというケースが多いようだ．

- Reference
Blogging Pro - 20006-08-17 - CSS Optimization: Make Your Sites Load Faster for Free-
http://www.bloggingpro.com/archives/2006/08/17/css-optimization/

Icey - Projects - CSS Compressor
http://iceyboard.no-ip.org/projects/css_compressor

Clean CSS
http://www.cleancss.com/

Online CSS Optimizer / Optimiser
http://www.cssoptimiser.com/

flumpCakes - Online CSS Optimiser/Optimizer
http://flumpcakes.co.uk/css/optimiser/

CSS Formatter and Optimiser/Optimizer (based on CSSTidy 1.2)
http://www.cdburnerxp.se/cssparse/css_optimiser.php

CSS Tweak
http://www.cssdev.com/csstweak/

Factor CSS
http://zamez.org/factorcss

- via
秋元@サイボウズ研究所プログラマーBlog: CSSの圧縮サービス比較記事
http://labs.cybozu.co.jp/blog/akky/archives/2006/08/css_optimization.html

ubicast Blogger - リッチコンテンツ対応ブログ クライアント

- Summary
goo ブログ,FC2ブログ,livedoor ブログ,Seesaa ブログ,ココログなどのブログサービスや，
Movable Typeに対応したブログ投稿ソフト．

Windows Live Writer[2006-08-22-8]の日本語版のようなソフト．

- Reference
ubicast Blogger
http://www.ubicast.com/blogger/

- via
窓の杜 - ワープロ感覚で記事を編集できるフリーのブログ投稿ソフト「ubicast Blogger」
http://www.forest.impress.co.jp/article/2006/08/22/ubicastblogger.html

長すぎるURIへのアクセスによってログ解析ができない

- Summary
WebDAVの脆弱性をつく攻撃によって，一行が長すぎるログが記録される．
このログ以降，awstatsが解析できない．

[2003-05-25-1]とも関連有り．

- access_logに残るログ

192.0.2.10 - - [11/Aug/2006:18:34:51 +0900] "SEARCH /\x90\x02\xb1\x02\xb1\x02\xb1\x02\xb1\x02\xb1\x02\xb1\x02\xb1
…
\x90\x90\x90\x90\x90\x90\x90" 414 271 "-" "-"



- access_logに414エラーのログを記録しない
httpd.conf

LogFormat "%h %l %u %t \"%!414r\" %>s %b \"%{Referer}i\" \"%{User-Agent}i\"" combined


- Reference
AWStats 6.0
http://cyberam.dip.jp/linux_server/log/awstats60_main.html

JavaScript Lint - JavaScriptの文法をチェックするソフトウェア

- Summary
JavaScriptの文法をチェックするソフトウェア．

- JavaScript Lint が検出する一般的な誤り
o 行末にセミコロンが無い行
o ifやfor，while等のないところにあるブレース("{}")など
o returnやthrow，continueやbreakによって，実行されることが無くなってしまっているコード
o break文が無いcase文
o 数値の前や後についている小数点
o A leading zero that turns a number into octal (base 8).(?)
o コメント内にあるコメント
o Ambiguity whether two adjacent lines are part of the same statement.
o 一つの文なのかそうじゃないのか分からない，繋がった文
o 何もしていない文

- JavaScript Lint が検出する，そこまで一般的でない誤り
o バーレンやアサインメント，コロンやカンマが前に来ていない正規表現
o セミコロンではなくカンマで区切られてしまっている文
o おかしな場所でのインクリメントやデクリメント
o void が使われている時
o "x+++y" や "x---y" の様に連続している "+" や "-"
o while や for ループの中で labeled ステートメントが使われいる部分
o ブレースが使われていないif, for, while

- Reference
JavaScript Lint
http://www.javascriptlint.com/

The Online Lint (JavaScript Lint Online版)
http://www.javascriptlint.com/online_lint.php

Out of Hanwell (JavaScript Lint開発者のblog)
http://www.outofhanwell.com/blog/

7korobi8oki.com - 2005-08-19 - "JavaScript Lint"でJavaScriptの文法を細かくチェックする
http://www.7korobi8oki.com/mt/archives/000080.html

WebFX - グラフを描くためのJavaScriptライブラリ

- Sample

<html>
	<head>
		<script type="text/javascript" src="includes/iecanvas.js"></script>
		<script type="text/javascript" src="includes/chart.js"></script>
		<script type="text/javascript" src="includes/canvaschartpainter.js"></script>
		<link rel="stylesheet" type="text/css" media="screen" href="includes/canvaschart.css" />
	</head>
	<body>
		<div id="chart" class="chart" style="width: 400px; height: 200px;"></div>
	</body>
</html>


function draw() {
	var c = new Chart(document.getElementById('chart'));
	c.setDefaultType(CHART_AREA | CHART_STACKED);
	c.setGridDensity(5, 5);
	c.setVerticalRange(0, 100);
	c.setHorizontalLabels(['mon', 'tue', 'wed', 'thu', 'fri']);
	c.add('Spam',            '#4040FF', [ 5, 10, 20, 10, 40, 52, 68, 70, 70, 60]);
	c.add('Innocent',        '#8080FF', [ 8,  7, 12, 20, 24, 16, 36, 28, 28, 45]);
	c.add('Missed Spam',     '#A5A5FF', [ 8,  7, 12, 20, 24, 16, 36, 36, 18,  5]);
	c.add('False Positives', '#DEDEFF', [ 1,  2,  3,  2,  1,  4, 18, 12,  8,  7]);
	c.draw();
}
 
window.onload = function() {
	ieCanvasInit('includes/iecanvas.htc');
	draw(); 
};


- Reference
Chart Usage (WebFX)
http://webfx.eae.net/dhtml/chart/usage.html

- via
phpspot開発日誌 - 2006-08-22 - JavaScriptでグラフを描画出来るライブラリ『WebFX』
http://phpspot.org/blog/archives/2006/08/javascriptwebfx.html

AJAX Interface Design - フォームとラベルの配置など，インタフェースデザインについての考察

- Reference
LukeW: AJAX Interface Design
http://www.lukew.com/resources/articles/ajax_design.asp

LukeW: Web Application Form Design
http://www.lukew.com/resources/articles/web_forms.html

Functioning Form - Web Application Form Design Expanded
http://www.lukew.com/ff/entry.asp?155

- via
オレンジニュース - 2006-08-16
http://secure.ddo.jp/~kaku/tdiary/20060816.html#p13