gas-webpagetestでWebPagetestのパフォーマンス計測を自動化、可視化する | Web Scratch
gas-webpagetestというGoogle Apps Scriptで動作するパフォーマンス計測ツールがあります。 このツールでは、WebPagetestという指定URLなどにウェブブラウザでアクセスし、パフォーマンスに関するメトリクスを取得するツールの計測や結果の記録を自動化できます。 記録はGoogle SpreadSheetに逐次書き込まれ、その記録をGoogle DataStudioで可視化したりダッシュボードを作成できます。 ここまででてきたツールは無料で十分に使えます。 gas-webpagetestを使うことでとりあえず計測を自動化してみるようなところを殆どコストなしに実現できます。 gas-webpagetestを使って取得した記録データをGoogle DataStuidoで可視化したサンプルは次のURLで確認できます。 DataStudio + gas-webpage
JavaScript Plugin Architectureというプラグイン設計について学ぶ無料の電子書籍を書いた
JavaScript Plugin ArchitectureというJavaScriptのプラグイン設計についての電子書籍を書きました。 この書籍はJavaScriptのライブラリやツールにおけるプラグインアーキテクチャについて見ていく事を目的としたものです。 以下の形式で読むことができます。 Web版 PDF形式 ePub形式 Mobi形式 GitHub上にソースコードも公開されているでので直接Markdownファイルを読むこともできます。 MarkdownよりはWeb版の方が見やすいのでそちらをオススメします。 Twitterのハッシュタグは#js_plugin_book 更新情報はRSSやリリースノートから見ることができます。 v1.0.0 最初に書くと決めたプラグインアーキテクチャが揃ったので1.0.0としてリリースしました。 JavaScript Promiseの本の時と同じく、継
JSDocをランタイムassertに変換するBabelプラグインを書いた
JSDocをassertに変換するライブラリとそれを使ったBabelプラグインを書きました。 azu/babel-plugin-jsdoc-to-assert: Babel plugin for jsdoc-to-assert. azu/jsdoc-to-assert: JSDoc to assert ライブラリのjsdoc-to-assertの方は、JavaScript ASTのコメントからassertの文字列を作り出すだけのシンプルなものです。 実際に使う場合は、Babelのプラグインとしてbabel-plugin-jsdoc-to-assertを使い、コードを変換してランタイムassertを追加させます。 やっていることとしては、FlowTypeをランタイムチェックするbabel-plugin-typecheckのJSDoc版とも言えます。 babel-plugin-typechec
V8の最適化とIRHydraでの可視化とベンチマークについてのメモ
V8 の最適化について 色々(主にVyacheslav Egorovさんの記事やスライド)読んでたのでそれのメモ。 この文章は2014年9月13日に書かれて最適化されていないため、この文章を元に最適化をすると失敗すると思います。 参考まとめ V8に関するリソースまとめ V8 Resources - Vyacheslav Egorovさんによる thlorenz/v8-perf - Thorsten Lorenzさんによる Understanding V8 and JIT compilation basics - Google スライド - 概要分かりやすい Hidden Class V8がリリースされた時から特徴としてあげられている最適化 V8: an open source JavaScript engine - YouTube V8 祭り - Backnumbers: Steps to
Virtual DOMを持つMV*ライブラリのmercuryについて
最近node-webkitアプリを書く時、何かしらのMV*やデータバインディングライブラリと言われるものを試しているのですが、floating-memo.appではRaynos/mercuryを使いました。 mercury は小さなモジュールを組み合わせたライブラリとも言えますが色々特徴的です。 完全にモジューラーな実装 Virtual DOM FRP ファイルサイズが小さめ モジューラーな実装とは何かというとmercuryのindex.jsを見ると面白い事が書かれています。 /* Pro tip: Don't require `mercury` itself. require and depend on all these modules directly! */ require("mercury") しないで、直接それぞれのモジュールを読み込んで使えるという事が書かれています。 (これ
power-assertの使い方 Node.js編
Power Assertとはassert(a === b); のような単純なアサーションでも、 Assert失敗時(テストが通らなかった時)に分かりやすい情報を表示できるようにする機能の事を言います。 JasmineやChaiが持つshouldやexpect等言った豊富なアサーションを覚える必要なく、 シンプルにassert()を使うだけでも十分な失敗時の情報が得られるため、沢山のアサーションを使い分けしなくていいというメリットがあります。 この記事ではPower AssertのJavaScript実装であるtwada/power-assertの使い方について紹介します。 記事を読む前に このNode.js編とブラウザ編で分けるぐらい長い記事となってるので、 お忙しい方は5分ぐらいで分かるpower-assertというスライドもあるので、そちらを読んでざっくり把握してみるのもいいでしょう。
power-assertでJavaScriptのテストをする ブラウザ編
power-assertという単純なアサーションでも、テストが失敗した時に分かりやすい情報を出せるテストライブラリ/ツールについての記事です。 前回、power-assertの使い方 Node.js編 | Web scratchではpower-assertの動作やNode.jsプロジェクトでの簡単な導入方法について解説しました。 前回のpower-assert + gulpで紹介したプロジェクトをそのまま使っていくので、見ていない場合はそちらから見ていたほうがいいかと思います。 今回は、ブラウザでのpower-assertの動かし方とデバッグについて書いていきたいと思います。 今回扱う実行環境 Node.js ＜＝ 前回 ブラウザ Browserify 前回やったこと まずは前回紹介したgulp + power-assertのプロジェクトを元にやっていきます。 azu/power-asse
JavaScriptのいろいろなコーディングルールをまとめてみた
JavaScriptの書き方はJavaScript自体がある程度自由なためいろいろな書き方ができますが、一貫性を持って書いた方がバグなども発生しにくくなるため、コーディングルールを定めておくのはよいことだと思います(特に複数人の開発の場合) 有名な企業やライブラリはコーディングルールも公開している事が多いので適当にまとめてみました JavaScript style guide – MDC Docs Mozilla/Firefox向けのものなので、一部ECMAScriptの範囲を超えたものも含まれています。 多くの人が見ていると思うので、見たことない人は一度読んでみるといいです。 jscsにこのコーディングルールをチェックするプリセットが用意されています。 Google JavaScript Style Guide Google JavaScript Style Guide 和訳 — Goo
ニコニコ動画のAPIまとめ | Web scratch
ニコニコのマイリスト周りにAPIがいろいろ増えていたので、列挙してみる。 使い方は http://res.nimg.jp/js/nicoapi.js をよく読む。 見方としては 分別 メソッド名 URL(http://www.nicovideo.jp/api/foo/bar という感じで使う) クエリー(それぞれの要素を&でつなげて指定) 返ってくるもの という感じで書いている。 Cathode Music: ニコニコ動画(9)APIを纏めた http://tewi.blogspot.com/2009/11/9api.html も併せて読む。 書き方の一例(testという名前のマイリストを新規作成する) Nico make mylist ←のブックマークレットをニコニコ動画上で実行する var token = NicoAPI.token; location.href = “http
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
