Node.js 0.12 では yield が使えるのでコールバック地獄にサヨナラできる話
Node.js の次のメジャーバージョン 0.12 で yield が使えるようになります。 そのおかげで、JavaScript のコールバック地獄に光が差し込むのです。ああ、さようなら、コールバック地獄。 7 年ごしで実現した yield 2006 年、Firefox 2 のリリースと同時に yield は JavaScript 界に登場しました。随分と前の話ですね。 登場した当時は JavaScript 界隈でけっこう話題になっていました。 JavaScript 1.7 の yield が凄すぎる件について - IT戦記 Latest topics > JavaScript 1.7のyield文ってなんじゃらほ - outsider reflex JavaScript 1.7 の新機能: Days on the Moon 登場したときにはインパクト大きかったものの、結局 Firefox
これがスマートフォン向けサイトを作るときの viewport 設定３パターンだ
スマートフォン向けの Web サイトを作るとき、viewport の設定次第で使い勝手が大幅に変わる。 最近はレスポンシブ Web デザインが流行してるけども、その大前提として viewport の設定パターンを抑えておくのは重要だろう。 この記事では、viewport の設定によって、見た目・使い勝手がどう変わるかを解説する。 パターン1: 何も考えずに HTML を書く まずは、viewport を指定せずに、単純な HTML をスマートフォンで表示してみる。 <!DOCTYPE html> <head> <meta charset="utf-8"> </head> <body> <img src="/images/logo-ja.png"> <p>色んな素材がごった煮になった様子をお椀で表現しています。 湯気が<strong>「てっく」</strong>に見えるのが隠し味になっていま
-webkit-text-size-adjust: none を絶対に設定してはいけない理由
PC 版の Google Chrome や Safari で見たときにユーザビリティーが落ちるから。 以上。 で終わってしまうと記事にならないので、ちゃんと説明しておく。 そもそも -webkit-text-size-adjust とは何か iPhone や Android のブラウザーは、縦向き (Portrate mode) と横向き (Landscape mode) の文字サイズを自動調整する機能がある。 これを制御するのが CSS の -webkit-text-size-adjust である。 文字サイズ自動調整の具体例 次のような HTML をスマートフォンで表示してみる。 <!DOCTYPE html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-
「いいね！」ボタンは XFBML 版を設置して Facebook に最適化すべき
右側の最近のアクティビティが増えています。もうちょっと下にある「いいね！」一覧も増えますが、あまり目立ってません。 XFBML 版の「いいね!」ボタンを押してみる 押した状態になるところまでは同じだけど、コメント入力用のポップアップが出てきます。 通常の投稿としてタイムラインに表示されましたね。 単に「いいね！」したときに比べて、目立つようになりました。 じゃ、ニュースフィードはどうなる？ 自分のタイムラインは分かったので、友達のニュースフィードではどうでしょうか。 Facebook の開発者向けドキュメントには If users do add a comment, the story published back to Facebook is given more prominence. もしユーザーがコメントしたら、コメント内容は Facebook に反映されて、さらに目立つようになり
jQuery を高速に使う CSS セレクタの書き方 - てっく煮ブログ
JavaScriptjQuery は CSS セレクタで要素を選んで処理できるのが魅力的ですね。そんな jQuery ですが、CSS セレクタの書き方次第で速度が大幅に変わってきます。ここでは jQuery の内部処理を疑似コードで示しつつ、jQuery を高速に使うためのポイントを５つに絞って紹介します。何度も同じセレクタを実行しないクラスだけを指定するのは禁止#id を積極的に使う途中までの結果を再利用する子供セレクタ(>)を使うと速くなることがある※ この記事は jQuery 1.2.6 のソースコードを元に記述しています1. 何度も同じセレクタを実行しない改善前 // 例題 1 $("div.foo").addClass("bar"); $("div.foo").css("background", "#ffffff"); $("div.foo").click(function(){
オブジェクト指向なコマンド環境「Powershell」を試してみた - てっく煮ブログ
Microsoft 製の最新のコマンドライン環境「Powershell」が面白かったので、楽しいところをまとめてみた。UNIX な人にも使いやすい親切設計コマンドプロンプトでファイル列挙と言えば dir だけど、Powershell では ls も使える。 PS> ls Directory: Microsoft.PowerShell.Core\FileSystem::C:\ Documents and Settings\nitoyon Mode LastWriteTime Length Name ---- ------------- ------ ---- d---s 2006/02/19 22:35 Cookies d-r-- 2006/02/17 23:39 Favorites d-r-- 2006/02/19 18:56 My Documents d-r-- 2004/08/19 9
具体例で説明するデザインパターン - てっく煮ブログ
JavaScriptデザインパターンってなんだかたいそうなものに考えられがちだけど、実は、そこかしこのライブラリや仕様に取り込まれていることが多い。「デザインパターン分からん」とか「で、どうやって使うのよ」と悶々としている人には、「どういうところで使わているのか」を知っておけばイメージも沸きやすいし、意外にたいしたことないんだな、ということが分かるんじゃないだろうか。そこで、JavaScript やその周辺の技術で、デザインパターンがどのように使われているかを紹介してみることにする。ここでは、GoF本の順番に沿って、以下の11個のパターンを取り上げる。生成に関するパターン Factory MethodAbstract FactoryBuilderPrototypeSingleton構造に関するパターン AdapterComposite振る舞いに関するパターン Chain Of Respon
てっく煮ブログ - ActionScript やるなら入れとけ。rascut 導入と使い方。
asActionScript 3.0 でコマンドライン開発してる人は必携の rascut を導入してみた。Flex 開発や AIR 開発でも使えるよ。rascut は id:secondlife さんによる fcwrap 後継バージョン。ファイル修正から自動的にプレビューまでできたり、trace() の出力をコンソールに出力してくれたり、かなり便利。以前、勝手が分からずにかなり苦労したけど、最近、RubyForge にアップロードされてからは gem 一発で超簡単になったよ。前準備Flex SDK と fcsh を準備しましょう。fcsh にはパスを通しておきましょう。Flex SDK については ActionScript 3.0メモ さんを参照あれ。fcsh については fcsh で Apollo を高速コンパイル あたりを参照あれ。Flex 3.0 SDK には fcsh が付属してる
Twitter の crossdomain.xml 問題について。 - てっく煮ブログ
ついったー足あと帳 関連でこんなブログ記事を発見した。今回は twitterのprotectな発言とかsettingからメールアドレスの取得や変更なんかできちゃってたわけで…2008-03-09 - skubotaの日記変更？？間違った情報が広がるとよくないので勝手に補足。この記事には誤解がある。確かに取得はできるけど、変更はできない。実際に試した私が言うんだから間違いない。（補足）ためしたのは、ついったー足あとちょうを作ったらへん。今は仕様変わってるかも(?)たぶん、サーバー側でリファラを見て弾いてるんだと思う。SWF からリクエストする場合は、SWF の URL がリファラとしてつくようになっている。リファラをなしにして送ったらうまく行くことも確認した。だから、swf からのクロスドメインアクセスに対しては通用しないであろう。よって、(1)メールアドレスの変更、(2)パスワードリセット
as3Query: alpha version (New Wave ActionScript) [TECH-NI Blog]
as3Query is an ActionScript3.0 port of John Resig's exellent JavaScript library jQuery 1.2.1. This port is released under the MIT and GPL licenses(as is the original jQuery). Documentation is NOT available. Please refer to the original jQuery Documentation. Most features are ported except for Ajax methods. Download Full source code for the engine and examples is hosted on a Subversion(SVN) server
AS で別ドメインの画像を読み込むときの注意点 - てっく煮ブログ
asActionScript を使って 外部ドメインの画像を読み込むときの注意点を調べてみた。AS3 で調べたけど、AS2 でもセキュリティの機構自体は同じ（だと思う）。読み込み方Loader クラスを使えば外部ドメインの画像をロードできる。 var loader:Loader = new Loader(); var req:URLRequest = new URLRequest("http://www.example.com/sample.gif"); loader.load(req); addChild(loader); 画像形式は PNG、GIF、JPEG のみ。BMP はダメ。アニメーション GIF の場合は１フレーム目しか描画されない。読み込み完了したことを知るためには、contentLoaderInfo プロパティの complete イベントを監視すればよい。ファイルが存在し
The Future of JavaScript メモ - てっく煮ブログ
The Future of JavaScript -presented by Mozilla & Shibuya.JS- のメモ。発表資料： John Resig: Tamarin and ECMAScript 4 (PDF)ES4 の概要は ECMAScript 4 の Draft をざっくり読んでみた - てっく煮ブログ で Overview を読んで勉強したので、だいたい知ってることだった。ここでは概要と細かなところを、まとめておく。（間違いがあったらツッコミください）概要3つのプロジェクトActionMonkey Tamarin を Spidermonkey に統合これを JavaScript2 として Firefox 4 に搭載ScreamingMonkey IE に Tamarin を統合するものMS が ES4 を実装することは期待できないIronMonkey Python
Adobe MAX リアルタイムレポート：Flex採用時のプロジェクトのワークフローとベストプラクティス - てっく煮ブログ
id:sato-shi さん。クラスメソッド：二十数件の Flex プロジェクト実績、AIRも数件。目次事例から見る成功談/失敗談プロジェクト開発標準設計手法とベストプラクティスAIRが業務アプリケーションに与える可能性業務向けRIA開発プロジェクト経済的な効果がある 開発できること 疎結合標準コンポーネントメリットプロジェクトの経験則凝ったUIは後で困る （コンセプトが変わったときに作り直しになる）別の担当者が作業できるようにFlexの事前説明Flexで何ができるの？VB・Delphi より優れているもの事例を紹介する モックでは理解してもらえない失敗事例超高度なUIを提案してしまう 標準コンポーネントをいかに使うかが鍵UIは天からの鶴の一声がかかりやすい 鶴を押さえておくスコープが定まらない追加され続けている使用が落ち着かない（事前説明） 「普通あるでしょ」Undo, Redo などサ
Adobe MAX リアルタイムレポート：ニコニコ動画とFlash - てっく煮ブログ
ドワンゴ 戀塚さん。まとめのクオリティよりもリアルタイム性を重視したメモ。たぶん後で資料公開されるので、正確な情報はそちらにて。(追記)公開されたようですdwango research and development dept. ≫ Blog Archive ≫ Adobe Max Japan 2007 講演資料「ニコニコ動画とFlash」ニュースサイトにも記事が出たようです。開発者が明かす「ニコニコ動画」人気の“キモ” - ITmedia Newsドワンゴ開発者が語る「ニコニコ動画」の中身 − ＠ITCodeZine：【Adobe MAX Japan 2007】 ニコニコ動画がActionScript 2を採用したワケ（レポート）ニコニコ動画とは2.1 参加方法動画投稿 意見を問いながら投稿できるコメントをもらえてモチベーションが高まる既存動画を加工する。２次３次加工が容認されているマイ
MARUBIRU RSS Reader
このサービスを利用するためには Flash Player 9 以降が必要です。 → インストールする This site requires Flash Player 9 or later. → Please click here to download Flash Player 9 ブログのURLやニュースサイトのURLを入力してください： Please input URL of any blog or news site.: (例) アサヒコム、発言小町、livedoor天気予報、竹原慎二 オフィシャルブログ、はてなブックマーク 人気エントリ (ex) CNN.com、digg、Popular pages on del.icio.us
はてなダイアリーに Flash を埋め込むガジェット - てっく煮ブログ
はてなダイアリーで JavaScript eval に続く、はてなダイアリー向け汎用ブログパーツ第２弾。今回は Flash を埋め込めるようにしてみました。サンプルこんな感じで。サイズも変えられる。使い方こちらからどうぞ。SWF の URL を入力して、サイズ変更して、背景色変更して、「コードを取得」ボタンで貼り付け用のHTMLを取得します。どうぞご利用ください。ソースコードソースは http://nitoyon.googlepages.com/embed_flash.xml。内部で swfobject.js を使っているので、何も考えずに同じ MIT ライセンスで公開。IE6 ではスクロールバー分の余白が表示されてしまったので、document.body.scroll = "no" で特別に対処してます。雑感他のドメインの Flash を埋め込めるので便利。だけど、「無断リンク禁止」な
Google Gears の使い道 - てっく煮ブログ
Google Gears (BETA) が発表されました。Google Gears はウェブサービスにオフライン機能を付け加えやすくするためのフレームワークです。フレームワークが提供するのは次の３つの機能です。LocalServerオフラインになったときにも HTML や JavaScript、CSS にアクセスできるようにする。ブラウザのキャッシュ（一時ファイル）を強化したイメージ。Databaseオフライン時に行った動作を記録しておく。SQLite ベース。ブラウザの Cookie を大容量化したイメージ。WorkerPoolCPU を消費する機能をバックグラウンドで実施する機能。setTimeout で無理やり細切れに実行していた部分を任せることができる。スレッド機能とも考えられる。開発者は、これら３つの機能を駆使して、オフライン機能を実装することになります。ありがちな実装パターンは
てっく煮ブログ - Apollo 触ってみた。すごすぎ。
Apollo のα版がリリースされたので、さっそく触ってみました。初日はランタイムをインストールしてサンプルを動かしてみました。コンパイルは時間がなくてまだ試せてません。2007.2.24追記：HTML+JS版 Apollo アプリを作ってみる で解説文章を書きはじめていますApollo を知らない人のために、おおざっぱにざっくり説明しておくと、Apollo は Web アプリを作るようにローカルアプリケーションを作れるようになるステキなライブラリです。Flash だけに縛られているわけではなく、Flash, Flex, HTML, Ajax などを統合して利用することができます。イメージはこんな感じ（Adobe の apollo_docs_alpha1_031907.zip からの引用）。図からもわかるように、HTML/JavaScript だけで Apollo API を利用してローカ
てっく煮ブログ - JavaScript の角丸ライブラリまとめ
JavaScriptJavaScript の角丸ライブラリについて調べていたら、RUZEE.Borders というのを見つけました。こいつがかなりすごかったのですが、ついでに他の角丸ライブラリとも比較してまとめておきます。どれも画像は使用せず、div タグなどをいっぱい作成して丸く見せている力技のライブラリです。他にもいいのがあったら教えてください。Nifty Cube→サンプルNifty Corners の後継。9KB (+CSS 2KB)角のサイズは 10px, 5px, 2px の３つから指定border は指定不可能 (div の入れ子により border っぽく見せることはできる)背景画像への対応不明CSS セレクタ(一部)で指定可能transcorners→サンプルは transcorners のサイト上部mootools 必須。prototype.js との組み合わせムリ（た
JavaScript 用デバッグコンソール "IEerBug" [tech.nitoyon.com]
IEerBug は Internet Explorer 6.0 と FireFox 1.5 で動く JavaScript 用のデバッグ コンソールです。 FireBug と同じ console.log()、console.debug() などの関数が使えるようになるため、FireFox と IE の両方でデバッグする場合に便利です。コンソールに出力したオブジェクトを、DOM インスペクタを利用して解析することも可能です。 使い方 ieerbug.zip をダウンロードし、中身をアプリケーションのディレクトリに配置します。IEerBug 用のディレクトリを作成して、その中に配置しても問題ありません。 HTML の中で次のようにして ieerbug.js を読み込みます。
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
