javascriptに関するakisutesamaのブックマーク (55)

  • ゲーム作成で学ぶCanvas機能 | エンタープライズ | マイコミジャーナル

    Canvas Tutorial by Bill Mill IEを除く主要ブラウザで対応が進みHTML5で正式な規格になると見られているHTML要素のひとつにCanvasがある。CanvasはJavaScriptから操作できる描画エリアで、これまでWebブラウザで実現するにはプラグインを必要したような処理をJavaScriptから簡単に実現できるようになる。 Canvasを使ったプログラミングに興味があるのであれば、Bill Mill氏が作成したCanvas Tutorialはかなり優れた教材といえる。ゲームブレークアウトのようなCanvasアプリケーションを10ほどのステップを経て作成するというもので、Canvasの作成からプログラミングまでがわかりやすいくまとめられている。ステップごとにコードを実行するウィンドウも用意されており、最後のステップでゲームとして動作するようすがわかる。 なお

    akisutesama
    akisutesama 2008/11/27
    ゲームチュートリアルもついていていい感じ、と思ったら実際にやってみたら簡単すぎた。簡単すぎな上に答えが最初から出ていて面白くない・・・
  • はてなブックマークのコンテンツの JavaScript を高速化する - IT戦記

    はじめに 「新はてなブックマーク」になったということで、とっても便利になったのですが、ブックマーク一覧ページ*1が若干 JavaScript に時間が掛かっているみたいです。 というわけで 調査してみたいと思います。調査して、改善できそうなところは後で纏めて「はてなアイデア」にでも登録しようと思います。 この日記は調査しながら、過程を書いていくつもりです。 準備 まずは、人のサイトの JavaScript を書き換えて試してみるための環境を作ります。 作業用ディレクトリを作る とりあえず、ホームに HatenaJS というディレクトリを作ります。 $ mkdir HatenaJS $ cd HatenaJS CocProxy をダウンロードしてくる 以下から CocProxy というツールをダウンロードしてきます。 http://coderepos.org/share/wiki/CocPr

    はてなブックマークのコンテンツの JavaScript を高速化する - IT戦記
    akisutesama
    akisutesama 2008/11/27
    CocProxy (Ruby製のローカルプロキシ、Webリクエストをローカルファイルで差し替える)を使って、他人ページのJSを自分の好きなように書き換えることが出来る)の使い方の良い見本。
  • もうこれで十分。HTML上でテーブルを表示するなら·Sigma Grid MOONGIFT

    業務システムを構築する際に、一覧表を表示するという処理は多い。そしてそのデータを並べ替えたり、チェックボックスを入れたりしたいというニーズも多く発生する。場合によってはカラムを並べ替えたり、一括更新したいなんて言われることもある。 ソートも並べ替えもページネーションも全部こみこみ それを一つ一つ実装していては非常に工数がかかってしまう。そこで使いたいのがこのSigma Gridだ。 Sigma Gridはテーブルの表示とソート、データ編集などを可能にする超豪華ライブラリだ。LGPLライセンスの下に公開されているオープンソース・ソフトウェアだ。 Sigma Gridはデータの表示に際してJSONでデータを渡す必要がある。そのため既存のシステムにそのまま組み込むのは難しいかもしれない。だがその変更してもあまりあるメリットを享受できるに違いない。 画像表示とクリックアクションの例 まずカラムごと

    もうこれで十分。HTML上でテーブルを表示するなら·Sigma Grid MOONGIFT
    akisutesama
    akisutesama 2008/11/27
    データがJSONでなければ渡せない点と、ライセンスがLGPL(jQueryベースなんだからGPL+MITでいい気がするんですが)でなんか嫌な感じな点以外はパーフェクト。
  • Ajaxian � iPhone for JavaScript Developers

    Enterprise Strategy Group: Go-to-market Expertise to Help You Win

    Ajaxian � iPhone for JavaScript Developers
    akisutesama
    akisutesama 2008/11/22
    iPhoneのSafari Mobile 用JS Tips
  • MOONGIFT: » 必見!JavaScriptのalert処理にさよならを「Blackbird」:オープンソースを毎日紹介

    ※ 画面は公式サイトデモより JavaScriptのデバッグによく利用されるものと言えば、alertだろう。簡単に使えて便利な関数だが、ブラウザの処理が止まってしまったり、長文の表示が難しいなどデメリットも数多い。 alertとお別れするためのJavaScriptデバッグツール そこで使ってみたいのがBlackbirdだ。Google Code上で公開されているオープンソースのJavaScriptアラートだ。 Blackbirdは見た目の格好いいフローティングダイアログにログを表示できる。デバッグ、インフォ、ウォーニング、エラー、プロファイルの5つのメッセージパターンが設定できる。Blackbirdのウィンドウでは各メッセージタイプの表示、非表示が切り替えられるようになっている。 表示位置の変更、表示するメッセージの種類が変更できる さらにF2キーを押して表示/非表示を切り替えたり、Shi

    MOONGIFT: » 必見!JavaScriptのalert処理にさよならを「Blackbird」:オープンソースを毎日紹介
    akisutesama
    akisutesama 2008/10/14
    デバッグログ出力ライブラリ。Firefox、Opera、Chromeでは同様のより高性能なサービスがあるので無用、実質IEとSafari専用かな?でもいちいちデバッグログ出すためだけに専用のライブラリ持ってきて専用のソース書く?
  • https://pyjamas.sourceforge.net/

    akisutesama
    akisutesama 2008/10/08
    PythonでGWT。それだけです。意地でもJavaをバックエンドにしたくない人向け?
  • Safari4 と IE8 で実装された DOM Storage とは何か - IT戦記

    はじめに 皆様 JavaScript のスピード競争が激化し、 ECMAScript 3.1 の仕様の策定が進むなど、激動の JavaScript 時代をいかがお過ごしでしょうか。 さて今日は、今、ちまたで大ブレイクの兆しを見せている DOM Storage という仕様を紹介したいと思います。 DOM Storage とは何か まず、 DOM Storage とはどんなものなのでしょうか。 とても簡単に言ってしまえば、とてもたくさんのデータが保存できてサーバーに自動で送られない Cookie みたいなものです。 さらに、 Cookie とは違って JavaScript からとても扱い易く作られています。 では、この DOMStorage の具体的なソースコードを見てみましょう。 <!DOCTYPE html> <html> <head><title>DOMStorage の使い方</tit

    Safari4 と IE8 で実装された DOM Storage とは何か - IT戦記
    akisutesama
    akisutesama 2008/09/27
    これは以前紹介されていたSafari3.1向けのSQL APIとは別なのね。でもこっちの方がシンプルで使いやすそう。/ただこういうクライアントサイドの保存手段ってクライアントの環境を汚しそうで嫌だ、とくにiPhoneとかiPhoneの環境
  • http://pi.kodfabrik.com/

    http://pi.kodfabrik.com/
    akisutesama
    akisutesama 2008/09/27
    おっ、JavaScriptの新しいフレームワークか、Firebug Liteにも使われているとは面白そうだ。どれどれ・・・「License: GNU-GPL」だめだ!これじゃ仕事で使えねえ!!逃げろ!!
  • JavaScriptベストプラクティス: Unobtrusive DOMプログラミングのススメ | エンタープライズ | マイコミジャーナル

    Alex Holt氏がSmashing MagazineにおいてjQuery and JavaScript Coding: Examples and Best PracticesのタイトルのもとJavaScriptプログラミングのベストプラクティスを紹介している。Alex Holt氏は「Unobtrusive DOM Scripting」と呼ばれるプログラミング手法がWebサイトに適用するにあたり優れているとし、Unobtrusive DOM Scriptingの実現にはjQueryが実にいい具合で活用できることを説明している。 同氏はDOMを経由してWebページの各種データにアクセスしてなんらかの動作をさせるプログラミング方法をDOM Scriptingと呼び、DOM Scriptingのなかでも必要な機能を必要な要素に対して適用するものといったニュアンスを強める場合にUnobtrusi

    akisutesama
    akisutesama 2008/09/26
    HTMLに構造を書いてCSSで見た目を良くしてJavaScriptで動きを付けましょうねという話。そのためにon...とか<script>タグは使わないようにしようと。
  • まじで使えるJavascriptライブラリ75選 | CREAMU

    Javascriptで優れたインターフェースを実装したい。 そんなあなたにおすすめなのが、『75 (Really) Useful JavaScript Techniques』。まじで使えるJavascriptライブラリ75選だ。 以下にいくつかご紹介。 » Lightview スムーズに画像を拡大してくれる » FancyUpload アップロード中のプログレスを表示してくれる » SWFObject Javascriptを使ったFlashプレーヤ » JavaScript tabifier 簡単にJavascriptで切り替えられるタブインターフェースが作れる » FancyZoom 1.1 簡単なエンベッドでスムーズに画像を拡大してくれる » SimpleModal オーバーレイするクールなモーダルダイアログ » A Mac OS X-style Dock In JavaScript

    akisutesama
    akisutesama 2008/09/16
    またこの手のJavaScriptライブラリ集か!!!!いや便利なのは間違いないんだけど
  • Purchase Intent Data for Enterprise Tech Sales and Marketing - TechTarget

    akisutesama
    akisutesama 2008/09/09
    JavaScriptでUUID(Universal Unique ID)を生成する方法。しかもめちゃめちゃ簡単。IDってこういう風に作られていたのか・・・
  • MOONGIFT: » 要注目!モダンなUIを実現するJavaScriptライブラリ「LivePipe UI」:オープンソースを毎日紹介

    JavaScriptを使って、クールなインタフェースを実現するライブラリは幾つか存在する。よく使われるものとしては、画像をクリックするとその場で拡大表示するもの、タブインタフェース、WYSIWYGなHTMLエディタ、レーティング、プログレスバー、コンテクスト(右クリック)メニューなどなど。 フローティングウィンドウ どれも個別のライブラリは存在する。だが、よく使われるものだけに、一つ一つ用意するのが面倒という人もいるはずだ。そこでこれを使おう。 今回紹介するオープンソース・ソフトウェアはLivePipe UI、Prototype.jsを使ったモダンなUIを実現するライブラリだ。 LivePipe UIが実現する機能はタブ、WSYIWYGエディタ、ツールチップ、フローティングウィンドウ表示、レーティング、プログレスバー、コンテクストメニューなどがメジャーなものとして挙げられている。レーティン

    MOONGIFT: » 要注目!モダンなUIを実現するJavaScriptライブラリ「LivePipe UI」:オープンソースを毎日紹介
    akisutesama
    akisutesama 2008/09/08
    prototype.jsベースのライブラリ。jQueryのプラグインでは似たようなのがたくさんあるが、prototype.jsでは珍しい?かも。
  • Firefox Hacks:知らないと確実に損するUbiquity環境構築法 (1/2) - ITmedia エンタープライズ

    最近大注目のFirefox拡張機能「Ubiquity」。自分でコマンドを自作できない方でもUbiquityの真の実力を知ることはできる。稿では、コード共有サービスを利用して自分だけのコマンド環境を構築する方法を紹介する。 最近大注目のFirefox拡張機能「Ubiquity」。Google Chromeの登場で幾分落ち着いたとはいえ、その魅力に取りつかれた方も少なくないのではないだろうか。 Ubiquityの基的な解説については「ブラウザの新境地? Ubiquityが変える衝撃のブラウザ体験」や「Ubiquity標準コマンドチートシート」ですでに紹介してきたが、まだいまひとつUbiquityを使う気になれないという方のために、「FireFoxプラグイン『Ubiquity』に大量のコマンドを登録して日のサイトを一発で開くすごい方法」というエントリでUbiquityの活用術を解説している

    Firefox Hacks:知らないと確実に損するUbiquity環境構築法 (1/2) - ITmedia エンタープライズ
    akisutesama
    akisutesama 2008/09/08
    Ubiquity導入の際にはここを参考にしよう
  • 要チェック!CocoaアプリケーションのようなUIをWebブラウザ上で実現する·Cappuccino MOONGIFT

    いつ出るか、いつ出るかと待ち遠しかったがついに登場した! Mac OSXのインタフェースが優れていることは大多数の人が認めるだろう。Windowsには感じられない、エレガントなインタフェースはMac OSXiPhoneなどで活躍している。あのインタフェースをWebブラウザ上で実現できたらどれだけ良いだろう。 サンプルアプリケーションのflickrビューワー Ajaxを使ったGmailをはじめて触ったときのあの驚きを再び感じさせてくれるのがこのソフトウェアだ。 今回紹介するオープンソース・ソフトウェアはCappuccino、Webブラウザ上でCocoa風インタフェースを実現するアプリケーションフレームワークだ。 Webベースでありながら、JavaScriptを記述する必要はない。Objective-Cに似た、Objective-Jというプログラム言語で記述して、それをWebブラウザ向けにJ

    要チェック!CocoaアプリケーションのようなUIをWebブラウザ上で実現する·Cappuccino MOONGIFT
    akisutesama
    akisutesama 2008/09/07
    Demoを触ってみたが記事で紹介されているほどの感動はなかった。やたらと重いし。むしろどれだけ少ない労力でiPhone向けのWebアプリが開発できるかだけが気になるが、全く新しい言語を覚えるほどのものだろうか?
  • 第3回 Ubiquityでオリジナルコマンドを作ろう(応用編) | gihyo.jp

    今回は、前回に引き続き、実際に自分のコマンドを作ってみます。サンプルとしてgotoコマンドを例に挙げ、応用して利用する方法について紹介します。 gotoコマンド - シンプル版 開きたいサイトが明確にわかっている場合、ブックマークやポータルサイト、ソーシャルブックマークは操作性が遅い場合があります。ブックマークツールバーに登録しておいてボタン1つで飛ぶようにしておいても、対象が増えてくるとスクロール操作が必要になるなど煩雑です。コマンドとキーワードで特定のサイトにジャンプできるようになると便利です。 ここでは、Ubiquityを使ってキーワードから特定のURLにジャンプするコマンド「goto」を作成しながら、Ubiquityコマンドの作成方法や、より実用的な実装方法を説明します。 リスト1 gotoコマンド - シンプル版 CmdUtils.CreateCommand({ name: "g

    第3回 Ubiquityでオリジナルコマンドを作ろう(応用編) | gihyo.jp
    akisutesama
    akisutesama 2008/09/07
    Ubiquityの解説、名詞形オブジェクトについても解説あり。名詞形オブジェクトは_nameフィールドとsuggest関数を実装すれば良いようだ、動的に生成できる
  • Purchase Intent Data for Enterprise Tech Sales and Marketing - TechTarget

    akisutesama
    akisutesama 2008/09/07
    MacのCocoaに酷似したものをWeb上で開発できるようにするフレームワークのようだ。言語はObjective-JというObjective-CをJavaScriptっぽくしたものを使用するらしい。実質、iPhoneのWebアプリ開発専用FW?
  • 第2回 Ubiquityでオリジナルコマンドを作ろう | gihyo.jp

    第2回目の今回は、実際に自分のコマンドを作ってみます。まずは、チュートリアルからのサンプルを参考にし、基的な記述について見てみましょう。 Ubiquity 0.1チュートリアル Ubiquityコマンドを自作する場合、Mozilla Labsで公開されているチュートリアルLabs/Ubiquity/Ubiquity 0.1 Author Tutorialが一番最初に読むべき資料となります。Ubiquityコマンドの定義方法や考え方がまとまっており、JavaScriptの経験があればこのチュートリアルを読むだけでサクサク開発できるようになります。 コマンド定義関数 Ubiquityプロンプトでcommand-editを実行してエディタを開きリスト1を入力します。 この関数でhello-worldコマンドが作成されます。Ubiquity 0.1ではcmd_から始まる関数は自動的にUbiqui

    第2回 Ubiquityでオリジナルコマンドを作ろう | gihyo.jp
    akisutesama
    akisutesama 2008/09/04
    Ubiquityのコマンドを自分で作ってみようという記事。JSON形式で非常に簡単。名詞形という概念が面白い。
  • グーグル「Chrome」、JavaScriptベンチマークで競合ブラウザを圧倒

    Googleがオープンソースのウェブブラウザ「Chrome」をリリースした理由の1つとして、同社は「処理速度」によって実現される、より高速なブラウジングと、いっそうリッチなアプリケーションを追求していることが挙げられる。では、実際Chromeの処理速度は、他のブラウザと比較してどの程度なのか。 Googleは5種類のJavaScriptベンチマークを行った。Chromeはこれらすべてのテストで、他のブラウザを凌ぐ結果を出している(提供: Stephen Shankland/CNET News) Googleエンジニアで、ChromeJavaScriptエンジンV8を担当するテクニカルリーダーLars Bak氏は、米国時間9月2日に行われた同ブラウザの発表イベントで、ChromeJavaScriptの実行速度は、他のブラウザの「何倍も速い」と自負している、と語った。JavaScript

    グーグル「Chrome」、JavaScriptベンチマークで競合ブラウザを圧倒
    akisutesama
    akisutesama 2008/09/03
    おかしい、これはおかしい、ひとつだけ飛びぬけて次元が違う、何だこれ・・・GoogleReaderがまるで(文字通り、Firefox3も凄かったが次元が違った)ローカルアプリのように動いたからもしやとは思ったけどこれは凄すぎる
  • Purchase Intent Data for Enterprise Tech Sales and Marketing - TechTarget

    akisutesama
    akisutesama 2008/09/02
    EclipseベースのIDE・AptanaでPyDevが動くようになり、jQuery1.2.6に対応しましたよという記事。すげえ!家のWEB編集専用で使っていたEclipseをひとつこちらに変更してみよう
  • これは凄い、Ajaxをオンザフライ解析 - Razor Profiler | エンタープライズ | マイコミジャーナル

    Razor - Profile and Optimize Web 2.0 Ajax Performance WebアプリケーションやWebページのデバッグ・分析にはFirebugが重宝する。しかしながらFirebugはFirefoxのエクステンションとして開発されているためIEやSafari、Operaといったほかのブラウザで作業する場合はそのブラウザ向けに提供されているツールかまたはFirebug Liteを使う必要がある。Firebug LiteはFirebugの機能をほかのブラウザにも提供する興味深いクロスブラウザツールだが、Firefoxに提供しているのと同じ機能はまだ提供できていないし、うまく動作しない機能もある。 そこでクロスブラウザAjaxアプリケーション分析ツールRazor Profilerに注目したい。Razor Profilerはデプロイ済みのJavaScriptベース

    akisutesama
    akisutesama 2008/09/02
    ウェブサイトで使用しているAjaxの動作を解析してくれるWebアプリ。デモで試してみたが、UTF-8以外の日本語は文字化けするようだ。