Graspを使ったJavaScriptのリファクタリング
Refactoring your JavaScript code with Grasp | Grasp - JavaScript structural search, replace, and refactor という記事では、Grasp を使ったJavaScriptコードのリファクタリングについて書かれています。 この記事は Refactoring your JavaScript code with Grasp | Grasp - JavaScript structural search, replace, and refactor の簡単な紹介です Grasp は JavaScript ASTを元にgrepのような検索、sedのような置換などを行えるコマンドラインツールです。 GraspはNodeで(実際にはLiveScriptで)書かれているツールで npm 経由でインストールできま
Navigation Timing APIでブラウザの処理時間を可視化するツール作った - ( ꒪⌓꒪) ゆるよろ日記
最近のブラウザでは、 Navigation Timing API ってのがサポートされていて、これを利用すればブラウザがページをロードするのに要した処理時間の内訳を知ることができる。 例えば、"DNSのlookupに要した時間"や"DOMの構築処理時間"、"onloadイベントの処理時間"などを見ることができるので、クライアントサイドのパフォーマンス計測に役立てることができる。 Navigation Timing Navigation Timing APIの仕様 #JavaScript - Qiita HTML5で Speed Test, Navigation Timing APIによる性能データ収集 - ぼちぼち日記 Navigation TimingでWebアプリの読み込み時間ログ取得 - l4l このAPIは、 window.performance.navigationオブジェクトや
JavaScriptコードのパフォーマンス比較ができるWebサービス「jsPerf」の使い方
自分が書いたJavaScriptのコードスニペットに対してどのコードが早いのかベンチマークを比較することができるWebサービスであるjsPerfの紹介と使い方。JavaScriptでは同じ機能を実現するための方法は様々であり、どのコードが優れているのかを調べる方法としてプロファイラなどを利用することがあります。しかし、JavaScriptはブラウザ毎によっても速度が変わることが多いため、ブラウザ依存のツールだと比較しにくくなるため、ブラウザ上でテストコードを実行し、それらのベンチマークを簡単に記録、比較できるサービスがjsPerfです。 jsPerfの比較方法 jsPerfの内部ではBenchmark JSというベンチマークライブラリが使用されています。(jsPerfの運営者が作成している) jsPerfの計測方法は一定時間内にどれくらいコードスニペット部が実行できたのかで比較します。その
WebkitベースのJavaScriptコマンドラインツール「PhantomJS」 | JSer.info
don’t code today what you can’t debug tomorrow: PhantomJS: minimalistic headless WebKit-based JavaScript-driven tool http://ariya.blogspot.com/2011/01/phantomjs-minimalistic-headless-webkit.html PhantomJSはJavaScriptファイルを実行できるWebkitベースのコマンドラインツールです。 PhantomJSの面白い所はDOMやCanvasなど他のコマンドラインツールで触れにくい部分もネイティブにアクセスできるため、リッチアプリケーションなどのテストツールとして活用できそうです。 phantomjs somescript.js [argument [argument ...]] という感
HTML5 API チェッカー - HTML5 チュートリアル - HTML5.JP
HTML5 および、それに関連する仕様に規定された API がブラウザーに実装されているかをチェックします。 HTML5 HTML Canvas 2D Context Web Storage File API HTML5 Web Messaging Selectors API Level 1 Selectors API Level 2 Web Workers Geolocation API Server-Sent Events Element Traversal この API チェッカーは、厳密に、HTML5 仕様に準拠しているかどうかを調べているわけではありません。IDL 属性（プロパティ）については、得られたオブジェクトのコンストラクタ名または型を評価しています。メソッドについては、それが Function 型かどうかを評価しているだけです。そのため、実装していると結果が出たとしても、
はてなブログ | 無料ブログを作成しよう
この半年のつれづれ みなさま、お元気ですか？ブログを書くのが半年ぶり。書きたいと時々思うものの、時が流れるのが早くてあっという間にまた一年の半分が過ぎていきました。この半年何していたかなと自分で手帳を振り返ると、マンスリー手帳の欄に「楽しかったこと」と書いて箇条書きに…
第2回 JavaScriptのデバッグとチューニング | gihyo.jp
使用頻度が高いのはデベロッパーツールを起動するCtrl+Shift+I（もしくはCtrl+Shift+J）と、コンソールを開閉するESC、コンソールでは補完候補を選択するtabなどが挙げられます。 例えば、長くて間違えやすいencodeURIComponentのスペルは、Ctrl+Shift+Jでデベロッパーツールを起動してコンソールを開き（コンソールが開かなかった場合はESC）、eだけ打ってtabキーを2回押せば encodeURIComponent が補完されるので、スペルを簡単にコピーできます。 JavaScriptデバッガの活用 前回はブレークポイントの設置方法を紹介しましたが、もう一歩進んだ条件付きブレークポイントの設置方法を紹介します。 まず、通常のブレークポイントを設置します。 この青くハイライトされた行番号の上で右クリックすると次のようなメニューが表示されます。 ここで
第1回 詳説：デベロッパーツールの使い方 | gihyo.jp
こんにちは、Google Chrome ExtensionsのAPI ExpertとChromium-Extensions-Japan管理人を担当している、太田と申します。いつもはクロスブラウザで連載していますが、今回はGoogle Chromeのデベロッパーツールについて紹介します。 昨今のJavaScript、HTML、CSSブームの背景には、開発環境、特にFirebugに代表されるようなデバッグツールの目覚しい発展が大きく貢献していると思われます。その反面、高機能化するデバッグツールの各種機能を使いこなすことが難しくなってきているという現実もあります。そこで、今回から全4回でGoogle Chromeに搭載されているデベロッパーツールの使い方とそれを利用したデバッグ・チューニングのノウハウをお届けしたいと思います。第1回はデベロッパーツールの機能紹介と基本的な使い方を解説します。 な
Google Chrome版Firebug：デベロッパーツール取扱説明書 記事一覧 | gihyo.jp
運営元のロゴ Copyright © 2007-2025 All Rights Reserved by Gijutsu-Hyoron Co., Ltd. ページ内容の全部あるいは一部を無断で利用することを禁止します。個別にライセンスが設定されている記事等はそのライセンスに従います。
[brothercake] CSSUtilities
Version 0.99 Beta — 4th April 2010 CSSUtilities is a JavaScript library that provides unique and indispensible methods for querying CSS style sheets! Here are some of the things it can do: CSSUtilities can find all the rules that apply to an element, including information about properties, media, specificity and inheritance. It can give you properties information that bypasses browser normalizatio
第2回 完全版：ブラウザとデバッグ環境 | gihyo.jp
こんにちは、太田です。前回はクロスブラウザの入口として、各ブラウザの特徴をまとめつつ、実際にクロスブラウザなコードを紹介しました。今回はクロスブラウザ対策における基本である、各ブラウザ環境の構築について解説したいと思います。 前回紹介した通りブラウザにはたくさんの種類・バージョンがあります。それぞれが動作する環境を用意するだけでも、一苦労ではすみません。なるべく少ないマシンで、各バージョンをインストールして、さらにデバッグするための環境作りについて紹介します。なお、Safari以外はWindows環境を想定しています。さらに、特に断りがない限りはWindows XP SP3をベースに解説させていただきます。ご了承ください。 各ブラウザのデバッグ環境は近年目覚しいほどの進化を遂げています。統合デバッグ環境の草分けであるFirebugを筆頭に、Safari/Chrome（WebKit）のWeb
JSON Diff
Paste some JSON in each of the text fields. Click "Compare" to see the diff. Changed portions are displayed in yellow. Additions are displayed in green. Deletions are displayed in red. It also works as a JSON viewer. Click the disclosure triangles to display/hide portions of the JSON. Invalid JSON is indicated by the text fields turning red. Swap the contents of the text areas by clicking "Swap".
コマンドラインオプション - JsDoc Toolkitを使う！
サンプルの動作環境について このページに記載されているサンプルは、以下の動作環境を想定しています。 OS：Windows (コマンドプロンプト) JRE：JRE 6 ※「%JREインストールディレクトリ%￥bin」にpathが設定済みとする カレントディレクトリ：JsDoc Toolkitのインストールディレクトリ 記述例 java -jar jsrun.jar app\run.js c:\example\js\ -t=templates\jsdoc -d=c:\out\example -a JsDoc ToolkitはJavaで実装されたJavaScript実行環境である"Rhino"上で動作します。RhinoはJsDoc Toolkitの配布パッケージに含まれており、実行アプリケーション"jsrun"から起動されます。そしてjsrunはJsDoc Toolkitのメインスクリプトである
GPDE Team Blog : JavaScript Memory Leak Detector
Archived MSDN and TechNet Blogs 2/7/2020 2 minutes to read MSDN and TechNet blog sites have been retired, and blog content has been migrated and archived here. Archived blogs are grouped alphabetically by the initial letter of the blog name. Blogs and blog posts can be searched by their names, using the Search box at the top of the page. Actively updated blogs have been moved to other blog sites,
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Buy Instagram Likes - 100% Real & Instant | Only $1.49
Google Code Archive - Long-term storage for Google Code Project Hosting.
Google Code Archive - Long-term storage for Google Code Project Hosting.
GitHub - ku/peek: iPhone browser app for remote debugging
GitHub - yui/yeti: Yeti automates browser testing.
Diagnose and Prevent AJAX Performance Issues - dynaTrace software
