Webアプリケーションの中には、ときどき時間がかかる処理をしないといけない部分があります。アップロードされた画像のサムネイルを多数生成するときや、クライアントからのリクエストに応じてさらにリモートのサーバからファイルを取得してきたりするとき、ふつうに作るとユーザは処理が終わるまでの数秒~数十秒間待たされるのでイライラしてきます。 こんなときには昨年のYAPCでLiveJournal: Behind The Scenesの中で紹介されている、perlで書かれた非同期処理サーバのGearmanが役に立ちます。Webアプリケーションから時間のかかる処理を別プロセスで動いているGearmanに依頼しておくことで、時間のかかる処理が終わるまで待つことなくユーザにレスポンスを返すことができます。 ほんとうは、時間のかる処理の性質と、必要とされる機能に応じてGearmanとTheSchwartzとを使い
bookreader.jsは、長文を縦スクロールではなく、横スクロールで表示し読みやすくするJavaScriptライブラリです。 →プロジェクトのホーム (Google Code) - New!! →ダウンロード(ver 0.4.6) - 2009/04/18公開 ※ダウンロードの詳細については、こちらのページをご覧下さい。 まずは、このページで体験してみて下さい。キーボードの[→]/[←]キーが、「進む」あるいは「戻る」に対応します。画面上に表示される、半透明の▶/◀ボタンをクリックしてもOKです。使い方の詳細は「ヘルプ」を参照ください。 次期バージョンの開発状況 幸いにしてさまざまな方からフィードバックをいただきました。ありがとうございます。それを元に機能の絞り込みとWEBサイトへの「組込み方」について検討を行っています。まだ、実装の方針が定まった、という段階ですが次期0.8.x系のサ
プロトタイプ function Animal(){}; Animal.prototype = { sleep : function(){}, walk : function(){ alert('noshi, noshi') } }; function Human(){}; Human.prototype = new Animal(); new Human().walk(); // noshi, noshi もっともポピュラだと思われる。 変型プロトタイプ Human.prototype.__proto__ = Animal.prototype; new Human().walk(); // noshi, noshi ほとんどのIEを除くJavaScript処理系で実行可能。裏ワザちっく。 エクステンド /** * extend function * @param {Object} s su
いろいろためしたけど、以下が一番楽 // 変更 element.runtimeStyle.cssText = ' width: 100%; height: 100%'; // 戻す element.runtimeStyle.cssText = ''; 特に、戻すときに cssText 以外のプロパティを空にしても、おかしな挙動をするので cssText を使うといい。 しかも IE だけは、 CSSStyleSheet オブジェクトにも cssText が使える // これも IE だけ var sheet = document.createStyleSheet(); sheet.cssText = 'div { hoge: hoge; fuga: fuga } div div { piyo: piyo }'; sheet.cssText = '';
IE では element.uniqueID というのがある。 これは、要素に固有の番号を付けたものだ。 これが結構便利で、 var seen = {}; for (var i = 0; i < elemenets.length; i ++) { if (seen[elements[i].uniqueID]) elements.splice(i, 1); else seen[elements[i].uniqueID] = true; } みたいな感じで、使うことができる。 他のブラウザ 他のブラウザにはこれがないので、結構不便。 で、 getter で出来るじゃんって思ってググってみたら。 Dean Edwards さんがもう作ってた。さすが http://dean.edwards.name/moz-behaviors/src/ HTMLElement.prototype.__define
JavaScript Image ASCIIfier Utilizing magic and the <canvas> element to turn internet images into sexy ASCII art Download : jsascii.js Example usage: <html> <head> <script type="text/javascript" src="jsascii.js"></script> </head> <body> <img src="example/microbe.png" asciify="true" asciiresolution="medium" asciiscale="2" /> </body> </html> Original image: ASCII image: jsAscii grabs the image from
要素が挿入された瞬間を取得する 今までは出来ないと思っていたのですが、今日いろいろ試していて出来る方法が分かりました。 ですので、ちょっと紹介したいと思います。今のところアイデアなので、実用性は?です。 方法 HTML に以下の style 要素を挿入することで実現することができます。 <style type="text/css"> * { display: expression(function() { if (!this.__mark) { this.__mark = true; alert('inserted node: ' + this.tagName); } return ''; }.apply(this)); } </style> 実際に例を見てみましょう http://amachang.art-code.org/ieexpression/000.html <!DOCTYPE
Stay organized with collections Save and categorize content based on your preferences. The Google Hosted Libraries is a stable, reliable, high-speed, globally available content distribution network for the most popular, open-source JavaScript libraries. Google works directly with the key stakeholders for each library effort and accepts the latest versions as they are released. Libraries To load a
Google engineers spend a lot of time working on speeding up their Web applications. Performance is a key factor for our teams, and we recognize how important it is for the entire Web. When you take a look at the effort that it takes to setup work that should be simple, such as caching shared JavaScript libraries, you quickly realize that the Web could be faster than it currently is. The AJAX Libra
An unofficial blog that watches Google's attempts to move your operating system online since 2005. Not affiliated with Google. Send your tips to gostips@gmail.com. If you've ever wanted to use a JavaScript library like script.aculo.us, Prototype, jQuery or Dojo, but you couldn't upload its files to a site or you found it difficult to manage all the different versions, Google hosts them for you. "T
It’s been a little while since I last wrote about Cross-Window Messaging in Firefox 3 using postMessage and since that time it’s since a few API updates. Specifically the postMessage API has become much simpler and has stronger security brought into mind. If you’re unfamiliar with postMessage here’s a quick re-cap: It’s a way to communicate simple string-based messages across browser windows (this
行数を数えているのですが、コメント欄他のstr.split(/\n/).lengthはかっこいいけどoverkill 404 Blog Not Found:javascript - String.prototype.tr() released 本当でしょうか? 実際に試してみましょう。変数 s が対象文字列を指しているものとします。 // charAt var lines = 1; for (var i = 0, n = s.length; i < n; i++) if (s.charAt(i) == "\n") lines++; // Array var lines = 1; var chars = s.split(""); for (var i = 0, n = chars.length; i < n; i++) if (chars[i] == "\n") lines++; // sp
はじめに Flickrには綺麗な写真がたくさんありますが、写真を探すには検索キーワードの入力や、それりのクリック操作が必要で、ものぐさな私には少々面倒でした。また、Flickrは日本から遠いので、画面切替に時間がかかります。そこで、画面切替とクリック操作のあまりいらない、気楽に写真を探すためのインターフェイスを作ってみました。 http://taggrid.appspot.com/flickr/popular.html スクリーンショットの一部です。 アイデア 基本的なアイデアは次の3点です。 16000枚の写真を格子上に配置 Google Maps風のAjaxインターフェイス 似ている写真を近くに配置 1. の16000枚の写真はPopular Tags on Flickr | Flickrを起点にしてFlickr APIを使って取得しました。 2. のAjaxインターフェイスは自分でゴ
【1.1】 ExtJSという選択 ExtJS はJavaScript製のGUIフレームワーク。 これを使うと一つのページ内にウインドウをいくつも開いたりといった ページをデスクトップの様に扱うことが出きるようになります。 【1.2】 py2jsをつかったJavaScriptフリーな開発 py2jsというモジュールを こちら の記事から知りました。 これを使うと、pythonコードをJavaScriptに変換できるようになります。 ExtJSの初期化やイベントハンドリングをPythonで記述し、変換したJavaScriptを利用します。 このpy2jsをうまく使うことでJavaScriptに触れずにExtJSを使えるようになります。 【1.3】 JSON-RPCを使ったクライアント-サーバ通信 JSON-RPCクライアントJavaScriptモジュール (jabs
1秒でも早く動く快適なWebアプリケーションを開発することはフロントエンドプログラマやWebデベロッパが常に追い求めるところだが、SitePenにおいてTom Trenka氏による興味深い分析結果"String Performance: an Analysis"が公開されたので紹介しておきたい。同氏のドキュメントはテクニック的に参考になるものだ。 文字列処理はパフォーマンスを左右する重要な要素のひとつだ。Javaなどよく使われるプログラミング言語では文字列は変更不可能なオブジェクトとして扱われる。変更不可能にすることで文字列の重複を防ぎ、不要なデータのコピーを避けることで処理速度の向上が実現できるからだ。そのかわり文字列を編集する場合には、変更後の文字列を新しく生成するという手段をとる。このため文字列の編集という操作は新しく文字列を生成する操作と等価であるため、コストが高い処理になる。 そ
はてなグループの終了日を2020年1月31日(金)に決定しました 以下のエントリの通り、今年末を目処にはてなグループを終了予定である旨をお知らせしておりました。 2019年末を目処に、はてなグループの提供を終了する予定です - はてなグループ日記 このたび、正式に終了日を決定いたしましたので、以下の通りご確認ください。 終了日: 2020年1月31日(金) エクスポート希望申請期限:2020年1月31日(金) 終了日以降は、はてなグループの閲覧および投稿は行えません。日記のエクスポートが必要な方は以下の記事にしたがって手続きをしてください。 はてなグループに投稿された日記データのエクスポートについて - はてなグループ日記 ご利用のみなさまにはご迷惑をおかけいたしますが、どうぞよろしくお願いいたします。 2020-06-25 追記 はてなグループ日記のエクスポートデータは2020年2月28
As a sort-of reverse birthday present I’ve decided to release one of my largest projects, in recent memory. This is the project that I’ve been alluding to for quite some time now: I’ve ported the Processing visualization language to JavaScript, using the Canvas element. I’ve been working on this project, off-and-on now, for the past 7 months – it’s been a fun, and quite rewarding, challenge. The f
Roar - Notifications (v1.0) Roar is a notification widget that streamlines incoming messages, such as updates or errors, without distracting the user from their browser experience or breaking their work-flow by displaying obtrusive alerts. Roar is inspired by Growl, the notification system for Mac OS X and is realised with MooTools. Showcases Never-ending Feed Showing feed items with link but with
「Greasemonkeyのスクリプトで重い処理をやっちゃうと重いので、Flashに処理を委譲しちゃおう」の途中結果です。 今回は、以下のようなシナリオの実現を目的としてました。 1. Wikipedia日本語版のページにアクセスしたら、GMスクリプト起動。 2. GMからページのテキストを抽出し、Flash側に通知。 3. Flashでテキストの2-gramを算出。 4. FlashからGMスクリプトへ2-gramを通知。 5. GMスクリプト側で2-gramをalertで表示。 Flashに処理をさせている間はブラウザは自由に動けるはずなので、重い処理をクライアント側で行う際の設計パターンの一つにならんかな?というのがこの試みの動機です。 まずは、AS3のスクリプトをば。初AS3でしたが、意外とAS3では手間取りませんでした。昨日の問題を除いてな! //NGramer.as packa
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く