ドットインストール代表のライフハックブログ
jsLexとは? jsLexはRockstarappsが提供するEclipse向けのプラグインだ。Webサイトでは「a wide variety of tools that can be used to optimize a complete web application or just individual resources」と紹介されているが、CSSやJavaScriptなどの圧縮やHTML内のJavaScript/CSSの外部化、さらにはJavaScriptのプロファイリングなど、Ajaxアプリケーションのクライアントサイドの最適化に特化した機能を提供している。 なお、jsLexの最新のプロダクションリリース(安定板)は1.1.7だが、すでに次期バージョンである1.2のベータ版もリリースされている。1.2系ではさまざまな新機能が実装されていることから、本稿では執筆時点の最新のベー
「Webサイトを作るときに本当によく使う機能を、自分で作らずにさくっと実装したい」――。そんなワガママな願望をかなえてくれる JavaScriptライブラリが登場した。ミツエーリンクスが今月オープンソースとして公開した「MJL（MITSUE-LINKS JavaScript Library）」は、Webサイト制作に必須の“最小限の機能”に絞ったJavaScriptライブラリだ。 昨今相次いで公開されている、リッチなUIを実現するJavaScript/Ajaxライブラリとは異なり、MJLの機能はとてもシンプルだ。もともとWeb制作会社であるミツエーリンクスが「自社標準ライブラリ」として作成したものだけあって、汎用性・実用性を重視したライブラリになっている。 具体的な機能は以下の6つ。確かにどれもよく使いそうなものばかりだ。 画像のロールオーバー Flashオブジェクト埋め込みの機能拡張 新規
スクリプトが読み込まれるまで画像の読み込みがブロックされている - 同ブログより抜粋 WebページパフォーマンスツールであるYSlowの主要開発者でありYahoo! Exceptional Performanceの開発者であるStoyan Stefanov氏がNon-blocking JavaScript Downloadsというタイトルで、ページの読み込み速度を向上させるテクニックを簡潔にまとめている。これはブロックが発生するJavaScriptの読み込みを並列化することでページの読み込み時間を短縮しようというもの。Webページの読み込み高速化に効果的な手法なのでWebデベロッパは一度目を通しておきたい。 JavaScriptの読み込み中はほかの読み込み処理がブロックされる。これをDOM経由で動的にロードするように書き換えてやれば並列して読み込まれるようになる。Non-blocking
leigeberのエントリーから、スムーズにスクロールするサムネイルから拡大画像を表示する画像ギャラリーのスクリプトを紹介します。 Dynamic Image Gallery and Slideshow デモ slide.jsはjQueryやPrototypeなど他のスクリプトに依存することなく単独で動作するスクリプトで、動作環境はIE6/IE7, FF, Opera and Safariとなっています。 サムネイルはリスト要素となっており、オプションでは「拡大画像の格納場所の指定」「拡大画像の拡張子の設定」「スピード」などを設定することができます。
JavaScript - サーバー間で双方向のRPC通信を行う技術は「Aerial」（エアリアル）という名前になりました*1。アイディアを出していただいた皆様、ありがとうございましたm(_ _)m Aerialは、通信にFlashを使い、JavaScriptとサーバープログラムとの間で双方向のRPC呼び出しを行う技術です。つまり、サーバー側からJavaScriptのメソッドを呼び出したり、逆にJavaScriptからサーバー側のプログラムを呼び出したりします。 サーバーから直接JavaScriptのコードを呼び出したり、逆にJavaScriptからサーバー側のメソッドを呼び出したりできるので、通信の内容を意識する必要がなく、バグの混入を抑えます。RPC成分入り！ ライブラリを開発するときも、HTTPやブラウザ間の実装の違いを意識する必要も無く、ごく普通のTCP接続で通信を行うので、Come
Japanese / English JavaScriptで入力補完を手軽に行うためのライブラリです。 (【お知らせ】ver2.0からprototype.jsを必要としなくなりました) 下記のような機能を持っています。 入力内容をもとに検索を行い、補完候補を表示します。(Google Suggestぽく) Ajaxでは無く、初回画面表示時のみデータの読み込みを行い、それ以降は、クライアント側で対象データから検索します。したがって、入力内容に変化があってもサーバ側にアクセスすることはありません。 検索は、前方一致/部分一致、大文字と小文字の区別あり/なしといったように、オプションで簡単に指定できます。また、その他にも様々なオプションが指定可能です。 検索結果の表示上限を指定できます。(デフォルト上限20件) 補完候補はキーボードの上下と、マウスにて選択できます。また、キーボードで選択中にES
Password Meterは、パスワードの強度を独自の評価式で測定してくれるサービス&スクリプト。 たまにネットサービスでパスワードを決めようとするときにその強度を示してくれるサイトがあったりするけど、ああいうのを単体にしたようなものだ。 今評価しているのは、純粋な文字種やその規則性の判定だけで、辞書にあるかどうか、といった要素までは入っていない。 このチェッカプログラム自体(Javascript)もGPLで配布されているので、自分用に設置したり、改造したりすることができる。自分のサービスのユーザ登録フォームに使って、よりわかりにくいパスワードを設定してもらうように誘導したりできるかもしれない。 [追記] リンク忘れでした。ご指摘ありがとうございます via del.icio.us/popular この記事は移転前の古いURLで公開された時のものですブックマークが新旧で分散している場合が
Script.aculo.usは、Thomas Fuchs氏を中心とするチームにより開発されているJavaScriptライブラリだ。MITライセンスが採用されており、2005年から公開を始め、執筆時点では11月に公開されたバージョン1.8が最新版になる。本稿では、そのバージョン1.8を使って(連載継続中にバージョンアップした場合はそちらに変更する可能性がある)、同ライブラリの基本を6回にわたって紹介しよう。 なお、Script.aculo.usを扱ううえでの必須知識となるPrototype.jsの使用法については、連載『いまからはじめるPrototype.js』で解説しているので、そちらをご覧いただきたい。 Script.aculo.usの概要 Script.aculo.usはPrototype.jsをベースに動作するライブラリだが、Prototype.jsが1つのファイルにすべての機能を
昨日のSIGHCIのメモです。 最速インターフェースの研究と実践： ライブドア mala氏 まず、自己紹介を兼ねて概論 ブログ「最速インターフェース研究会」 WebのUIの進歩の停滞に対する批判を込めて名付けた 自分の肩書きは「インターフェースエンジニア」 よいUIを作るために「実体験に基づいたチューニングをしている」 自分で使ってみる ユーザの反応を見る 欲望に忠実に作る 作業としては、perl, html, jsの記述 「実のところ、プログラミングに詳しいと言える自信はないし、デザインのことも深くはわからないが、一人で一通りこなせる（完成品を作れる）という点は自分の強み。 よいUIを作るための作業は横断的。割り当てられた仕事をするだけの人ではダメ。」 作品紹介 2ch最速検索 キーボード操作だけでスレッド検索 まだAjaxは使っていない 「めくり型」UIの実験 スクロールしながら読むよ
フォームのパスワード強度を表示できるExt拡張JSライブラリ「Ext.ux.PasswordMeter」 2007年11月13日- Ext.ux.PasswordMeter These forms do not do anything and have very little validation. フォームのパスワード強度を表示できるExt拡張JSライブラリ「Ext.ux.PasswordMeter」。 Ext.ux.PasswordMeterを使えば、次のように、パスワードフィールドの入力に対して強度をメーターで表示することが可能です。 パスワードの強度を表示すれば、利用者のパスワード強度の強化に繋がりますね。 関連エントリ Ext2.0のアルファ版がリリース あのJavaScriptライブラリ「Ext」のバージョン2「Ext 2.0」のプレビュー
進捗状況を分かりやすくプログレスバーで表示できるJSライブラリ「jsProgressBarHandler」 2007年09月06日- Bram.us jsProgressBarHandler (Dynamic Unobtrusive Javascript Progress/Percentage Bar) jsProgressBarHandler is a rewrite of the (unfortunately wrongly named) AJAX Progress / Percentage Bar by Webappers. 進捗状況を分かりやすくプログレスバーで表示できるJSライブラリ「jsProgressBarHandler」。 プログレスバーがなめらかなアニメーション表示されるので、進捗状況が非常に分かりやすく表示できます。 デモページはこちら 利用にはprototype.js
Dean Edwards: Sniff! My current frog exaggerator of choice JavaScriptでIEかどうかをたったの1行で判別する方法。 なんと、次の1行だけで、isMSIE 変数に、IEで見れば true 、そうでなければ false を代入することが出来ます。 var isMSIE = /*@cc_on!@*/false; 次のサンプルコードで確認しました。 <html> <script language="javascript"> var isMSIE = /*@cc_on!@*/false; if (isMSIE) { alert('IE!'); } else { alert('not IE!'); } </script> <body> </body> </html> IEであれば IE! を alert し、そうでなければ not I
Web 2.0という言葉で総称される新たなインターネット時代。Webサイトやエンドユーザーに仕掛けられる攻撃もまた，2.0と呼ぶべき進化を遂げようとしている。攻撃者はWeb 2.0の中核技術であるJavaScriptを悪用してブラウザを狙う。従来の脅威対策は全く通用しない。今この瞬間にも，エンドユーザーは個人情報を盗まれる危険にさらされている。 ブログ/SNSなどユーザー発信型のサイト，Ajax，RSS──。華やかさがクローズアップされるWeb 2.0。ところがその裏側では，エンドユーザーに情報盗難などの危険が広がっている（図1）。インターネット・バンキングやEC（電子商取引）サイトのユーザーIDやパスワード，クレジットカード番号はもちろん，企業内のシステムにアクセスするためのパスワードや，パソコンに読み込んだ機密文書データなど，対象はあらゆる情報だ。 2006年12月末，米国のセキュリテ
デベロッパがFirefoxを使う理由はエクステンション! Ajax Webアプリケーションの開発者には、WebブラウザとしてFirefoxを愛用しているユーザが多い。その理由のひとつに豊富なエクステンション機能が挙げられる。Firefoxを使っているからエクステンションを使っているというよりも、エクステンションを使いたいからFirefoxを使っているという感じだ。 デベロッパに人気のあるエクステンションはいくつもあるが、代表的なところではAll-in-One GesturesやDictionarySearch、Greasemonkey、User Agent Switcher、ScrapBookなどを挙げることができる。そしてAjax Webアプリケーションの開発において必須ともいえるエクステンションに、Firebugがある。 Firebugに対する称賛の声は枚挙にいとまがない。「Fireb
mootools - 軽量なAjax/JavaScriptライブラリ ここでは、サイズの小さなAjax/JavaScriptライブラリである「mootools 1.0」(以下、mootools)の機能や使い方について解説する。mootoolsは、バージョン1.0がリリースされたばかりのライブラリで、ドキュメントが充実していることが特徴の一つである。 このmootoolsは、Valerio Proietti氏によって開発が続けられているAjax/JavaScriptライブラリである。The MIT Licenseのもとで、オープンソースソフトウェアとしてリリースされている。オブジェクト指向にのっとって開発されたモジュール形式のライブラリで、ダウンロード時に構成ライブラリを選択し圧縮率を指定して成果物を取得できるという特徴がある。 百花繚乱のAjax/JavaScriptライブラリ Ajax/
GT Nitro: Car Game Drag Raceは、典型的なカーゲームではありません。これはスピード、パワー、スキル全開のカーレースゲームです。ブレーキは忘れて、これはドラッグレース、ベイビー！古典的なクラシックから未来的なビーストまで、最もクールで速い車とカーレースできます。スティックシフトをマスターし、ニトロを賢く使って競争を打ち破る必要があります。このカーレースゲームはそのリアルな物理学と素晴らしいグラフィックスであなたの心を爆発させます。これまでプレイしたことのないようなものです。 GT Nitroは、リフレックスとタイミングを試すカーレースゲームです。正しい瞬間にギアをシフトし、ガスを思い切り踏む必要があります。また、大物たちと競いつつ、車のチューニングとアップグレードも行わなければなりません。世界中で最高のドライバーと車とカーレースに挑むことになり、ドラッグレースの王冠
2007 CSS Study Meeting http://artcode.g.hatena.ne.jp/keyword/2007%20CSS%20Study%20Meeting 発表をしましたので資料を置いておきます。 http://usrb.in/amachang/static/cssstudy/200701/ Firefox で動きます。IE でもぎりぎりうごきます。あ、でも、横長な表示域じゃないと崩れる可能性大です。 左右キーで操作してください。また、ソースは実行できるようになってるので、実際に実行しながら読んでいっていただけるとうれしいです。 他に事前に CSS のセレクタのバグリストとプロパティ一覧を作りました。 プロパティ一覧は element.style に辞書アタックを掛けて各種ブラウザから抽出したプロパティです。 http://usrb.in/amachang/stat
Webサービスにおけるセキュア通信といえばHTTPS(HTTP over SSL, HTTP over TLS)がデファクトスタンダード。これはSSL/TLSを活用してWebブラウザレベルで暗号化通信を実現し、Webブラウザとサーバ間における通信データをまるごと暗号化するというもの。Ajaxアプリケーションといえど、そこは同じだ。 しかし、HTTPSにするほどではないものの、通信内容の暗号化は実現したいという向きも多い。HTTPSでは認証局から許可を得た鍵を使わないとWebブラウザから警告が出るなど、面倒なことが多いからだ。そんなときには「aSSL」というライブラリを検討してみてほしい。HTTPSほど安全ではないものの、パスワード盗聴対策レベルなら便利に使うことができる。 aSSLとは aSSLはJavaScriptで開発されたセキュア通信のためのAjaxライブラリ。Francesco S
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
