細かいJavaScriptの仕様や習慣やテク集 - 三等兵
気づいたことやミスしたことなどメモしていたので確認作業。細かい仕様だったり暗黙のルールだったり、テクニックだったり。JSに慣れていたら当たり前なことばかりかもしらん。 追記のところはid:os0xさんより。ありがとうございます！ undefined var a; alert(a) // undefined 宣言だけだとundefined。undefinedというのは、宣言している変数に値が入っていませんよ、ということ。 そしてオブジェクトには無いプロパティとか参照すると出てくる。 var a = 100; alert(a.length); // undefined さらに引数も。 function func(val) { alert(val); } func() // undefined 引数はCallオブジェクトってのに格納される。このオブジェクトはローカルの変数が格納されるオブジェクト
JavaScriptテク、setTimeout()のかわりにpostMessage()を使う | エンタープライズ | マイコミジャーナル
Firefox web browser - Faster, more secure & customizable JavaScriptのタイムアウト処理「setTimeout」で処理できる最短の時間はブラウザごとに違っている。これはsetTimeoutで極端に短い時間が繰り返し使われた場合にブラウザのほかの処理に影響がでるのを避けるためのもので、主要なブラウザではだいたい10msが最短値に設定されている。Chromeではこの制限は緩く2msほどとされている。つまり、引数に0を指定しても0msとしては処理されず、10msなり2msなりで処理が実施されることになる。 しかしほかの処理はさておき、ともかく処理時間の短縮を実現したいというケースもある。そうした場合に利用できるテクニックをDavid Baron氏がDavid Baron's weblog: setTimeout with a sho
[JS]jQueryのプラグイン100選 -2009年総集編
2009年に紹介したものを中心としたjQueryのプラグイン100選です。 カルーセル・ニュースティッカー関連 ギャラリー・画像拡大関連 ナビゲーション関連 タブ関連 パネル・ボックス関連 角丸関連
JavaScriptのswitch文の速度はブラウザの違いでこんなにも差があった。 - 風と宇宙とプログラム
はじめに JavaScriptのswitch文は、CやJavaと異なりcaseのところに任意の式が書けるため、実行時にcaseの式も評価されるので基本的にはif-else文の並びと類似のものになります。つまり、caseの数に応じてパフォーマンスも低下すると予想されます。本当にそうなのか確認してみました。 測定した各ブラウザのバージョンは以下の通りです。 Firefox Chrome Safari Opera IE 3.5.6 4.0.249.30 4.0.4 (531.21.10) 10.10 8.0.6001 caseが数値リテラルの場合 パフォーマンスを測定するテストコードは下記のような簡単なものです。caseが1000個あるswitch文を10万回繰り返して実行したときの時間を測定しました。perf_test()関数の引数ｖに与える値に応じてcaseの条件で一致する場所が変わります。
JavaScript初心者におくる24のグレイトなtips - 三等兵
私が作ったわけではなく海外の記事です。自分も学習してみました。 phpスポーツ啓発日誌や、コカトリスさんや、アイスクレアームパラダイスさんのような、品質の良い訳は私にはできませんので見出しは意訳もしくは誤訳、文章は無視して訳してません。かつ、私がいろいろコードや文章つけたしてます。内容的にはほとんどズレてはないと思いますが、適当なのでおかしいところがあるかもしれません。 うっとうしい場合は原文をどうぞ。 24 JavaScript Best Practices for Beginners 1. 等価演算子で==使うなよボケ===だろナスチン野郎 ひぃぃぃ。 ==|!= だとねー、型は自動に変換されるんすよねー。ねー。 s = '1'; i = 1; alert(s == i); // true alert(s === i); //false えーと、==は「わし、数値も文字列も中身が一緒だ
JavaScriptを高速化する6つのテクニック | エンタープライズ | マイコミジャーナル
Thomas Fuchs, author of the script.aculo.us user interface JavaScript library, a member of the Prototype core team and a Ruby on Rails core alumnus. Thomas Fuchs氏が6 easy things you can do to improve your JavaScript runtime performanceにおいてJavaScriptの実行パフォーマンスを改善するための6つのテクニックを紹介している。Thomas Fuchs氏はscript.aculo.usの開発者であるとともにPrototypeコアチームのメンバーも務めている。またRuby on Railsでコアチームで開発を担当していたこともある。 JavaScriptエンジン
JavaScriptを高速化する31のチェックリスト | エンタープライズ | マイコミジャーナル
Is your JavaScript SLOW JavaScript? Amy Hoy氏およびThomas Fuchs氏がIs your JavaScript SLOW JavaScript?において、JavaScriptアプリケーションのパフォーマンスをチェックするためのチェックリスト [PDF]を公開している。印刷して利用できるように工夫されたチェックリストで、31のチェック項目がある。紹介されているチェック項目は次のとおり。 scriptタグは正しい位置に記述されているか DOM MonsterブックマークレットでDOMを分析しパフォーマンス問題を明かにする キャッシュヘッダを正しい状態にする 結合、インライン、事前キャッシュ ミニファイ、Gzip圧縮 Smush、CSS Script、Favicon フレームワークの確認 ラナウェイタイマの管理 DOMコード効率の最大化 ノードセレ
自分でAutoPagerize対応のスクリプトを書く簡単な方法 - blooo
ちょっとアレなタイトルですが、GreasemonkeyでAutoPagerize対応のスクリプトを自作する時の注意点を２つメモ。 自分はひよっこですが、これからGreasemonkeyスクリプト書いてみようかなという人の助けに少しでもなれば嬉しいです。 継ぎ足されたページに適用する方法 AutoPagerizeで継ぎ足された部分に自分のスクリプトを適用する方法あれこれ - 0xFF を参考に、AutoPagerize_DOMNodeInsertedを使うことにする。 以前はaddFilterとかGM_AutoPagerizeLoadedとか出てくる書き方をしていたんだけれど、この方法がやはり簡単・シンプルなので採用させて頂きました。 継ぎ足されたページ「のみに」適用する方法 新しく継ぎ足されたページのみに、スクリプトの内容を適用・反映したい場合。 注意しないと、継ぎ足されたページのみに適用
理由がない限り、Array.join("") による文字列連結は使わないほうがいいみたい - latest log
JavaScript の勉強を開始したときに「文字列の連結には Array.join() を使え」といった記事を見た覚えがあります(ソース失念したけど、 Operaの技術文書だった気がする ⇒ IE の技術文書だったかも)。 一年ほど信じてて、念のためベンチとってみたら「うそやーん」でした。ってお話。 ベンチの条件は、 3種類の文字列連結方法を試す 1. + Operator 2. String.concat() 3. Array.join("") 文字列の要素数を 11個 と 55個で試す <!doctype html><html><head><title></title> </head><body> <script> window.onload = function() { var now = +new Date, lp = 100; while (lp--) { job(); } d
川o・-・）＜2nd life - bookmarkletの文字数制限を無くす
bookmarkletを作るとき、IEでは500文字ちょい、Firefoxでは2000文字ぐらい(?)の文字数制限がある。また、作った後に一行にまとめたり、デバッグしたりも大変面倒。でもそれがとても簡単な方法でどうにでもなることをインターフェイス！インターフェイス！の人に教わった。 javascript:(function(){var s=document.createElement("script");s.charset="UTF-8";s.src="http://example.com/example.js";document.body.appendChild(s)})(); createElementでscript要素を作って、その中にhttp://example.com/example.jsとソースを指定することによってそのJSを実行できる。WinIEとFirefoxでは確認済み。
Javascript＆Ajaxの小技をまとめた便利サイトいろいろ | P O P * P O P
自分用のメモも兼ねてエントリー。JavascriptやらAjaxやらで何かやりたいときに便利そうなリンク集のまとめです。 Javascript Libraries 主要なライブラリーとエフェクト用の拡張機能、その他ツールなどです。まずはこちらからいろいろ試してみるのがよさげですね。 » Javascript Libraries Ajax Rain Ajaxの小技いろいろ集です。ちょっとしたスクリーンショット付きのこうしたリンク集は眺めていて楽しいですね。 » 485 + Ajax/Javascript/Dhtml examples and demos to download Mini Ajax こちらもAjax Rainと同様です。こちらも綺麗なサイトで眺めていて楽しいですよ。 » MiniAjax.com / A showroom of nice looking simple downl
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 -
JavaScript の要素追加・変更で innetHTML と DOM の速度検証
ちょっと昔に散々でまわったネタなんですけど・・・まぁ自分への備忘録っつーことで。 JavaScript でごにょごにょ動的に見た目を変更する社内ツールがあります。自分が作ったヤツなんですが、最近どうにも動きがモッサリしてきました。解析するまでもなく遅い原因は DOM で要素を追加・削除を大量にやっているのはわかっています。だいぶ前に DOM と innerHTML のどっちが高速化ってのが話題になった時期がありましたが、僕の経験（技を何も使わずに単純に DOM 操作を書く場合。というか普通の人の書き方がココに当てはまると思う。）では圧倒的に innerHTML が高速な場合が多いです。 ※innerHTML vs DOM ネタはこの辺が参考になります。 Javascript - Benchmark - W3C DOM vs. innerHTML 最速インターフェース研究会 :: 日本語テキ
JavaScriptのsortは必ずしも安定ではないのを覚えといてね - by edvakf in hatena
配列要素はソート (並べ替え) される。ソートは必ずしも安定的ではない(つまり、等価と比較された要素が元の順で残るとは限らない). comparefn が undefined でないならば、それは 2 個の引数 x と y を受け付け、 x < y ならば負の値、 x = y ならば 0、 x > y ならば正の値を返す関数であるべきである。 15.4 Array オブジェクト (Array Objects) 安定であると仮定した実装はしないでください。(複数列でのテーブルソートなど注意) 以上。 これより先は脱線なので読み飛ばしてもらってかまいません。 脱線1 Tagrolls on Delicious このページを開いたとき、Firefox と Safari ではタグがアルファベット順にソートされる。(たぶん IE も) Chrome と Opera では変な順にソートされる。 htt
JavaScript正規表現メモ。 (JavaScriptでよく使う書き方。) - こせきの技術日記
タイトル変えました。旧タイトル「JavaScriptでよく使う書き方」。よく使うけど毎回忘れる。 正規表現にマッチするかどうか。 RegExp#testを使う。 /abc/.test("abcdefg") // => true String#searchはマッチした位置を返す。マッチしない場合は-1。先頭にマッチすると0でfalseなので注意。真偽値が欲しい場合はString#searchを使わない。 "abcdefg".search(/xxx/) // => -1 "abcdefg".search(/def/) // => 3 "abcdefg".search(/abc/) == false // => true 正規表現の部分マッチを得る。 部分マッチを得るには、RegExp#execかString#matchを使う。execとmatchの速度は大して変わらない。 正規表現のベンチマー
javascript - ソースを見せてかつ動かすための３つのtips : 404 Blog Not Found
2009年02月24日04:30 カテゴリLightweight LanguagesTips javascript - ソースを見せてかつ動かすための３つのtips livedoor Blogを私が愛用しつづけている理由のひとつが、JavaScriptを受け付けること。 おかげでかなりのentriesが溜まりましたが、それだけにで実行用のソースと表示用のソースを用意するのが人一倍おっくうに感じられます。そんなわけで、どうやれば怠慢をもっと発揮できるかをまとめてみました。 0. DOMにIDをふらずにデモる こんな感じのデモがあったとしましょう。「404 Blog Not Found:javascript - Array#sortがオレquicksortより遅い!?」にあるものを書き直したものです。 # of Items: よくあるのは、inputタグやpreタグにIDをふって、docume
はてなブックマークの隠しモード発見！ - 聴く耳を持たない(片方しか)
タイトルは少し誇張気味。 はてなブックマークのURLの末尾に #benchmark を入れてアクセスするとブラウザのウィンドウ（もしくはタブ）のタイトル部分にベンチマークが表示されます。 1234(例) / タイトル つまり表示にかかった時間を1000分の1秒単位でチェックして、検証するモードがあるわけですね。 例 http://b.hatena.ne.jp/ http://b.hatena.ne.jp/#benchmark http://b.hatena.ne.jp/entrylist http://b.hatena.ne.jp/entrylist#benchmark http://b.hatena.ne.jp/hotentry http://b.hatena.ne.jp/hotentry#benchmark http://b.hatena.ne.jp/entry/http://d.ha
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Site Under Maintenance
JavaScriptでカレンダーを実現するための38のスクリプト | IDEA*IDEA