タグ

JavaScriptとTipsに関するagxのブックマーク (25)

  • IT戦記 - 一行で IE の JavaScript を高速化する方法

    以下の一行をすべての JavaScript の前に読み込む /*@cc_on _d=document;eval('var document=_d')@*/ この一行を読み込むことによって IE での document へのアクセスが 5 倍速くなります。 たとえば 以下のように、読み込む前と読み込んだ後を比較してみます。 // Before var date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date - date); // 643 /*@cc_on _d=document;eval('var document=_d')@*/ // After date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date -

    IT戦記 - 一行で IE の JavaScript を高速化する方法
  • 404 Blog Not Found:怠翻 - JavaScriptでありがちな9つのシマッタ

    2007年08月17日01:15 カテゴリ翻訳/紹介Lightweight Languages 怠翻 - JavaScriptでありがちな9つのシマッタ 私自身結構シマッタしちゃうので。 Nine Javascript Gotchas 尻カンマ注意 以下のコードはFireFoxでは動きますが、Internet Explorer (以下IE)では問題になります。 var theObj = { city : "Boston", state : "MA", } 最後にカンマが入らないよう注意しましょう。 浮気なthisは何を見てるやら 以下のコードで、thisは何を指しているでしょうか。 <input type="button" value="Gotcha!" id="MyButton" > <script> var MyObject = function () { this.alertMess

    404 Blog Not Found:怠翻 - JavaScriptでありがちな9つのシマッタ
  • 404 Blog Not Found:Digest - 今日にでも使うべきJavaScriptの7つのテクニック

    2007年04月25日12:00 カテゴリLightweight LanguagesBlogosphere Digest - 今日にでも使うべきJavaScriptの7つのテクニック 良質の記事だけに全訳したかったのだけど、時間もないので紹介と抄録。 Digital Web Magazine - Seven JavaScript Techniques You Should Be Using Today サンプルコードは、適宜書き換えてあります。 1. Branch when possible - 分岐はなるはやで これは実例を見た方が早いでしょう。クロスブラウザー対応のaddListener()を考える。機能だけを考えれば、以下でOK。 function addListener(el, type, fn) { if ( window.addEventListener ) { el.addE

    404 Blog Not Found:Digest - 今日にでも使うべきJavaScriptの7つのテクニック
  • EfficientJavaScript - Dev.Opera - 効率的な JavaScript

    EfficientJavaScript - Dev.Opera - 効率的な JavaScript 目次 この文書について 効率的な JavaScript ECMAScript eval や Function のコンストラクタを使うのはやめよう eval を書き換えよう 関数を使いたいなら function を使おう with を使うのはやめよう 性能を決める関数で try-catch-finally を使うのはやめよう eval と with は隔離しよう グローバル変数を使うのはやめよう 暗黙のオブジェクト変換に気をつけよう 性能を決める関数で for-in を使うのはやめよう 文字列は累積スタイルで使おう プリミティブの操作は関数呼び出しより速い setTimeout() や setInterval() には文字列でなく関数を渡そう DOM 再描画と再フロー 再フローの回数をでき

  • 複数のJavaScriptファイルを1コネクションでスッキリ一括読み込みする方法:phpspot開発日誌

    IEで透過PNG画像の透過処理を簡単に行うJavaScriptライブラリ「alphafilter.js... 次の記事 ≫:JavaScriptで3Dオブジェクトを作成するためのライブラリ「JS3D」 Supercharged Javascript Pre-compression also doesn't solve a multiple connection issue. 複数のJavaScriptファイルを1コネクションでスッキリ一括読み込みする方法。 HTMLでの読み込みタグも次のようにスッキリできます。 <!-- Namespace source file --> <script src = "yahoo.js" ></script> <!-- Dependency source files --> <script src = "dom.js" ></script> <script

  • 2006-12-29

    画像拡大後も処理を繰り返してしまう問題があったので修正しました。 http://yagi.xrea.jp/2006/12/miximix.user.js Greasemonkeyスクリプトなどを書いてると、対象HTML中にJavaScriptを埋め込みたくなることがあります。 ベタに書くと大変うざいことにりますが、 script.innerHTML = "add = function(a, b){" + " var ans = a + b;" + " return ans;" + "}"; こう書くとすっきり。 script.innerHTML = "add = " + (function(a, b){ var ans = a + b; return ans; }); 関数を普通に記述した上で、それを文字列に変換。

    2006-12-29
    agx
    agx 2007/01/28
    関数を普通に記述した上で、それを文字列に変換することで、文字列だけで書くよりもすっきりしてエディタの強調表示も行える。
  • prototype.jsを10KBにする方法

    2006-11-20T14:20:42+09:00 追記 「何者か」に攻撃を受けて、このページの内容が差し変わっていました。あわててバックアップファイルから復旧しました(「何者か」 = 酒……)。 prototype.jsを10KBにする方法の続き(.htaccessをスマートに使う) : 亜細亜ノ蛾 に続きを書きました。合わせてどうぞ。 JavaScript ファイルを圧縮する 正真正銘、Prototype(“prototype-1.4.0.js”)を10キロバイト(10,453 bytes)に圧縮して、しかも(当たり前ながら)動作するようにする方法です。 ──と聞いて真っ先に思い浮かぶのが「各種JavaScriptファイル圧縮サービス」、という人も多いでしょう。 しかし、自分が試してみたところ、例えば/packer/で圧縮したJavaScriptファイルは上手く動作しませんでした(他は

    prototype.jsを10KBにする方法
  • Jack Slocum's Blog » 3 Easy Steps to Avoid JavaScript Memory Leaks

    agx
    agx 2006/10/29
    javascriptのメモリーリークを避ける方法。YAHOO.util.Connect 使いましょうとのこと
  • 404 Blog Not Found:javascript - Douglas Crockford on DOM

    2006年10月22日23:20 カテゴリLightweight Languages javascript - Douglas Crockford on DOM うわあ、お宝。 Video Presentation: Douglas Crockford on the “Theory of the DOM” - The Web Standards Project Douglas Crockford, discoverer of JSON and JavaScript evangelist/veteran has given a training on the theory of the DOM lately and the videos are available on the web. あのDouglas Crockfordによるセミナー。Javascripterは全員必見! Dougla

    404 Blog Not Found:javascript - Douglas Crockford on DOM
    agx
    agx 2006/10/28
    javascriptをもっと使えるようになってから見たい。
  • FireBug と benchmark.js を使って稼働中のサービスの JavaScript パフォーマンスをチェックする - IT戦記

    まずはこれを見てください。 http://sample.ecmascript.jp/bench.htm このような感じで FireBug のコンソールを表示させて 適当なサーバにある benchmark.js を読み込んで benchmark.at('firebug')({ 'テスト1': function() { ... } }); って感じで、どんなサイトでもパフォーマンスを計ることが出来ます。 何が嬉しいのか いちいちサービスの JavaScript を書き換えて計測する必要がない。 思いついたときに、パフォーマンスチェックができる。 FireBug を入れていない、または Firefox 以外でパフォーマンスを計りたい場合 URL 欄に javascript:(function(){var s=document.createElement('script');document.bo

    FireBug と benchmark.js を使って稼働中のサービスの JavaScript パフォーマンスをチェックする - IT戦記
  • Enjoy×Study - JavaScriptを書き始めるとき

    JavaScriptを書き始めるとき、いきなり*.jsやHTMLに書いたりするのではなく、大抵下記に試しに書いて実行してみます。 JavaScript Development Environment JavaScript Shell Web Development Bookmarklets 上記2つのブックマークレット版 JavaScript Shell は、補完機能なんかもあって高機能ですが、IE、Operaだとどうもうまく動きません。 JavaScript Development Environment は、ブックマークレット版じゃないほうはIE、Operaでも動くので、どちらかというとこっち使うときの方が多いです。(Operaでのエラー表示が出来てないみたいだけども…) ブラウザ上で簡単に試せるってのはすばらしいですね。 で、その後に*.jsやHTMLに書いて、後はFireBug使い

    Enjoy×Study - JavaScriptを書き始めるとき
    agx
    agx 2006/10/22
    javascriptを書き始めるときに楽になるようなブラウザ上で確かめられる方法
  • IT戦記 - [javascript] Plain Old JavaScript Prototypes (普通の JavaScript も使えるようにしよう)

    Prototype.js や MochiKit や jQuery や dojo こういう便利なライブラリがたくさん出てきてとても便利になりました。 でもそのライブラリ当に必要? たしかに、グループワーキングを行うにはこれらのライブラリは必須だと思います。 でも、ちょいスクリプトを作るのに .bind(this) や $ や each や Event.observe が必要でしょうか。 いささかオーバスペックな気がします。 実際に「このツール Prototype.js 必須かよ。こっちは MochiKit で作ってるのにぃ」とかってことも多々あります。 あれを使うためにあれとこれを読み込んで、これを使うためにこれも必要だな。こんな感じだとサイトはどんどん重いものになってしまします。。。orz そこで、原点回帰です。 ちょっとしたツールでライブラリ使うのはやめようよ!何も使わなくても Jav

    IT戦記 - [javascript] Plain Old JavaScript Prototypes (普通の JavaScript も使えるようにしよう)
  • [暴満館] JavaScriptによるCSSの操作

    またFirefoxは短縮形で取得しようとすると、設定していないプロパティにデフォルト値が入った状態で返ってくるので注意する。 getStyleValue( "div.hoge", "background" ) //Mozilla : rgb(17, 34, 51) none repeat scroll 0% 0% ルールを削除する function deleteRule( index, sheetindex ) { if( sheetindex == undefined ) sheetindex = 0; document.styleSheets[ sheetindex ].deleteRule( index ); } 全てのルールにはインデックスが振られており、それを指定することでルールから消すことができる。 ただ、同じセレクタで上書きするのとほとんど変わらないので、あまり必要にならない

  • Web標準化時代のJavaScript

    このページはWeb標準化時代のJavaScriptについて書かれています。主に旧来の方法を新しい書き方にするための項目を掲載しています。 ミスや間違い、リンクエラーなどがありましたらopenspc@po.shiojiri.ne.jpまでお願いします。

    agx
    agx 2006/08/23
    XMLでJavaScriptを書いたり、JavaScriptを高速化するために
  • Firebug に自作関数を組み込む方法 - 技術メモ帳

    外部スクリプトをロードする関数を毎回書くのが面倒で、 Firebugの組み込み関数にしたら便利なんじゃないかと思って、 loadJS という名前で Firebug に組み込んでみた。 結論から言うと、 /chrome/content/firebug/commandLineAPI.js を編集したら、任意の関数を定義できた。 以下に、手順を書いてみる。 まず、ソースでもある Firebug拡張をダウンロードする。 http://releases.mozilla.org/pub/mozilla.org/extensions/firebug/firebug-0.4-fx+fl.xpi xpi は、実際にはただの zip ファイルなので、 unzip コマンドで解凍できる。 ./$ unzip firebug-0.4-fx+fl.xpi Archive: firebug-0.4-fx+fl.xpi

  • Collection & Copy - 複数行の文字列

    複数行の文字列 JavaScript Javascript Boot Camp Tutorial \を行端に置くことで、文字列を複数行に分けて記述できることを知った。 IE、Forefox、Operaで確認をした。 alert("<html>\ <body>\ <div>\ </div>\ </body>\ </html>"); 文字列リテラル (String Literals) ECMA Scriptの仕様を読んでも難しく、このことが記述されているのか否か判断ができない。 『JavaScript』の文字列リテラルの項を読み直してみたが記述は見当たらず、これまで色々なコードを読んだが利用されている例に会わなかった。 追記 2006/8/7 nanto_viさんから、詳細な情報をコメントで頂きました。 こちらへ転載させていただきます。 いつも、いつも、当にありがとうございます。 nanto

  • Shibuya.js を終えて #2 - IT戦記

    資料置いておきます。(Firefox 推奨、IE では一部エフェクトが効きません) ↓上下キーでページ送りです。 http://sample.ecmascript.jp/shibuya_js_tt2/amachang/ 感想 うーん。テーマがテーマなだけに新しいことを話すのが難しかった。 やっぱ、prototype.js script.aculo.us は語りつくされた感ありますね。 そんな中、 id:motemen さんの Mochikit にびびっとキマシタね! これだ!みたいな。今後、 prototype.js よりも Mochikit をいじっていきましょうかね。 あとは、最速 ma.la さんがすごかった。Trigger はパクると思う。 関連リンク http://shibuyajs.org/articles/2006/06/15/technical-talk-2

    Shibuya.js を終えて #2 - IT戦記
    agx
    agx 2006/07/15
    script.aculo.us についてあまり使われていないけど便利な機能
  • Solutoire.com - Ajax Resources

    agx
    agx 2006/07/15
    JavaScript 初級/中級向けリンク、デバッグ&テスト、エディタ、ヘルプ、Ajaxの基本〜サンプル集、チュートリアル、Ajax関連ニュース、Ajaxフレームワーク〜フレームワークのリファレンスへのリンク、豊富にリンクしたサイト
  • Bookmarklet - ブックマークレットを作成する際のポイント

    Updated: 2003-09-28 05:44:07+0900 [Home] 値を返してはいけない 値を返す式を使うとページを移動してしまいます。 javascript:contents='aaa' これならOK javascript:void(contents='aaa') 変数はページ内でグローバルになってしまう varをつけても、ブックマークレットで使用した変数は、ページ内でグローバルになってしまいます。表示中のページの動作や、他のブックマークレットの動作を変えてしまう可能性があります。 javascript:var contents='abc' javascript:var contents='123' 上のリンクをクリックしたあと、以下をクリックするとcontentsの中身が変わっているのが見えます。 javascript:alert(contents) これはページに書かれ

    agx
    agx 2006/07/02
    Bookmarklet
  • 一つのブックマークレットで「サイトの表示」と「スクリプトによる拡張」を行う方法

    プレーンな IE で LDR のハックをしていて思ったんですが、サイトの表示と拡張を別々のブックマークで行うのは少し面倒です。 そこで考えてみたところ、以下の様なパターンで項目を一化できることに気付きました: (function(url){ if (location.href != url) // 表示されていなければ location.href = url; // サイト表示 else { // 拡張コード } })("http://www.foo.com/") // 表示したいサイト URL単純なことですが、同じものを二度実行するだけなので結構楽になります。 当然ですが、「お気に入り」自体をアクセスしやすいように (Alt-a + ワン・キーぐらいで実行できるように) 管理することも重要になりますね。

    一つのブックマークレットで「サイトの表示」と「スクリプトによる拡張」を行う方法