Bigegg Lab

2011年 8月 13日

プロファイリング機能はメソッド一つ一つの分析をするような細かいチェックをする機能ではなく，全体の中からボトルネックを特定する際に効果を発揮する機能です。細かい部分では前述のconsole.time／console.timeEndなどで個別に計測したほうがよいかもしれません。

Google Chrome版Firebug：デベロッパーツール取扱説明書：第2回　JavaScriptのデバッグとチューニング｜gihyo.jp … 技術評論社 (via fingaholic)

6ヶ月前 | 固定リンク | 2011年 8月 13日 |

2011年 1月 18日

2011年はサーバサイド JavaScript の年！
サーバサイド JavaScript の本命は node.js！

ということで割と普通のウェブアプリケーションを node.js で作るためのチュートリアルを書いてみました。WebSocket とか新しめの話題は結構見ますが、PHP とかで普通のウェブアプリ作ってる人向けのチュートリアルとかあんま見ないような気がしたので、って感じです。

チュートリアルの内容ですが、コード量が少なめで機能的にも分かりやすそうなモノということで、短縮 URL ウェブアプリケーションを作ってみることにしました。bit.ly とか t.co とか nico.ms みたいなアレです。短縮 URL のデータは MySQL に保存します。

結構長文になっちゃったので、先に目次置いときます。

1. node.js のインストール
2. npm (Node Package Manager) のインストール
3. express フレームワークの簡単な使い方
4. ejs テンプレートエンジンを express フレームワークで使う方法
5. node.js 用 MySQL モジュールの使用例
6. 自作モジュールの作成例

チュートリアルを一通り試せば簡単なウェブアプリなら作れるようになるかもしんないので、お暇な方はどうぞ。

node.jsとMySQLで割と普通のデータベースウェブアプリを作ってみるチュートリアル | さくらたんどっとびーず

1年前 | 固定リンク | 2011年 1月 18日 |

2010年 12月 22日

node.jsに最適化されたホスティングサービス

Joyent Node SmartMachine (http://no.de/)

一番有名かつ実績がある。Node.jsを使ったコンテストのNode.js Knockoutでは最も多く使われていた。node.jsの開発者(@ryahや@izs)が働いている会社が運営。サーバOSはSolarisでgitを使ってdeployする。ssh接続も可なのでnpmで自由にパッケージ入れられる。β中なので無料。

Heroku (http://heroku.com/)

いち早くnode.jsへのサポートを表明したサービス。Railsのホスティングで有名。node.jsを使いたい場合は使わせてくれってメールしないといけないので日本人にはハードルが高いかもしれない。現在は新規募集休止中。現在はまだβなため、WebSocketがサポートされていなかったり同時接続は64クライアントまでで30秒でタイムアウトされるなど厳しい制限がある。来年以降の新バージョンに期待。

Node Jitsu (http://nodejitsu.com/)

かなり早い段階からアナウンスはあったが、初期にメール登録したのに未だに連絡が来ないので詳細不明。Node.js界隈では有用なライブラリをリリースしたりと結構活発に活動している。忍者好き。多分「Node術」って言いたいんだと思う。

node.js host (http://blog.nodejshost.com/)

かなり早い段階からテスターを募集していたが、なんか余り内容のないブログしかないので応募はしていない。活動が見えない。

ElusiveHippo (http://elusivehippo.com/)

結構早い段階から募集はしている。アカウントを取得した記憶はあるが、現在はログインも新規登録もできなくなっている。多分消える。

webbynode (http://www.webbynode.com/)

基本的には普通のVPSなんだけど、githubから直接deployができたりする便利なとこ。node.jsにも対応した専用のツールを使ってdeployや再起動などができる。

nodejs Cloud (http://www.nodejscloud.com/)

12/14に行われたNode.js Campに合わせて発表された。多分Joyentのと同じような感じっぽい。応募はしといた。

Duostack (http://duostack.duostack.net/)

12/14に行われたNode.js Campに合わせて発表された。多分Joyentのと同じような感じっぽい。応募はしといた。

JsApp.US (http://jsapp.us/)

ブラウザ上でnode.jsのコーディングや実行ができ、それをそのままdeployできちゃうというプラットフォーム。サインインすると自分のすきなサブドメインを使える(http://meso.jsapp.us/)。個人の週末プロジェクトなのであまり期待はしていないが結構積極的に活動はしている。

普通のVPS

基本的には普通のVPS借りて自分で環境構築するのもさほどの手間ではないです。僕はさくらとLinodeを使ってますがどこでもいいから借りてみてはいかがでしょう。

Amazon EC2

Amazon EC2のmicroインスタンスもいいと思います。http://www.embracingthecloud.com/2010/12/05/InstallingNodejsOnAmazonEC2.aspx の記事がかなり参考になります。記事中でも書かれているとおり、node.jsのコンパイルに時間がかかるのでコンパイルの際だけ性能のいいインスタンスに切り替えるのも手だと思います。

node.js のホスティングサービスまとめ - 自分の感受性くらい

サーバサイドJavaScriptであるnode.jsが動くホスティングサービスのまとめです。
似たような物でAptana Jaxerもあります。

サーバプログラムがJavaScriptで簡単に作れるようですね。
http://blog.asial.co.jp/668

1年前 | 固定リンク | 2010年 12月 22日 |

2010年 8月 13日

グルーポン系サイトでよく見られる「終了までなんとか！」というカウントダウンタイマーを実装してみました。jQueryのプラグインもあるのですが、そこまででもないのでちゃちゃっと書いちゃいましたよ。

実際のコードはこんな感じですが、その前にjQueryの読み込みを忘れないようにね（最近はもっぱらGoogle様に頼りっぱなし）。

なお、HTMLの方では#TimeLeftを表示部分のIDとして指定しておきます。

<script type="text/javascript">
$(function() {
  countDown();
});
function countDown() {
var target = new Date("August 26,2010 11:00:00");
var today = new Date();
var h = Math.floor(((target-today)%(24*60*60*1000))/(60*60*1000))
var m = Math.floor(((target-today)%(24*60*60*1000))/(60*1000))%60
var s = Math.floor(((target-today)%(24*60*60*1000))/1000)%60%60
$("#TimeLeft").text(h+'時間'+m+'分'+s+'秒');
  setTimeout('countDown()', 1000);
}
</script>

もうちょっと簡単に書けそうな気がしないでもないですが、まぁ、ご参考までに。jQuery使わないでもかけそうですが、どちらにしろjQuery使っていたのでお許しをば。

グルーポン系サイトでよく見られる「終了まで○時間○分○秒」をjQueryで実装してみる - IDEA*IDEA ～ 百式管理人のライフハックブログ

1年前 | 固定リンク | 2010年 8月 13日 |

2010年 7月 27日

NTTドコモおよびソ フトバンクモバイルの端末がJavaScriptに 対応したことによ り、XSSのリ スクが高まっています。そのような状況で、両事業者は、典型的なXSS試験パターンを「一見動作しなくなる」という対応を しています。

しかし、これら「対策」は非常に表層的なもので、URLを少し変えるだけでXSS攻撃ができてしま います。すなわち、XSS対 策としての効果はほとんどなく、逆に副作用の方が大きいと思わ れます。オレ標準JavaScript勉強会でも、 「alert殺したらデバッグが大 変になるのでは?」という指摘がありましたが、私も同感です。

携帯電話事業者に学ぶ「XSS対策」 - ockeghem(徳丸浩)の日記

モバイルサイトもXSS対策が必要な時代となってきました。

1年前 | 固定リンク | 2010年 7月 27日 |

2010年 5月 30日

「Zakas’ JavaScript performance tips」でJavaScriptの高速化手法が紹介されていたのですが、Reverse Loopの効用について説明されていました。

ループで処理したいときはその中身をなるべく少なくした方がいいのですが、Reserve Loopを使えばそれを実現することができます。

いつでも使えるわけではないですが、今まで使いこなせていなかったのでこれから積極的に検討していきたいですね。

// Forward loopよりも…
var i = 0;
while ( i < length ) {
    i++;
}
// Reverse loopの方が速い！
var i = length;
while (i--) {
    /* iを操作する必要がありません。 */
}

他にも高速化に役立つ手法がいろいろあるのでご参考までにどうぞ。「reflowを最小化しよう」は確かに、ですね。

» Zakas’ JavaScript performance tips – James Padolsey

【JavaScript Tips】 使えるときはReverse Loopを使うといいらしい… - IDEA*IDEA ～ 百式管理人のライフハックブログ

1年前 | 固定リンク | 2010年 5月 30日 |