Node.js Cluster+Socket.IO+Redisによるリアルタイム通知システム | サイバーエージェント 公式エンジニアブログ
『Node.js Cluster+Socket.IO+Redisによるリアルタイム通知システム』
Node.js Cluster+Socket.IO+Redisによるリアルタイム通知システム | サイバーエージェント 公式エンジニアブログ
Viz.js·Web上でGraphvizをSVGでレンダリング MOONGIFT
フローチャートなどの高度なグラフを描こうと思った時に使われるのがGraphvizです。テキストベースで記述していくだけでできるというのはやはり手軽です。しかしローカルソフトウェアをインストールしたり、セットアップしたりするのは面倒と感じる人も多いでしょう。 そこでさらに再利用性を高めてくれるのがViz.jsです。WebベースでGraphvizを使えるようにしてくれます。可能にするのはまたしてもEmscriptenなのですが、面白さを体感してください。 例として以下のようにGraphvizのDOT言語をそのままscriptタグに記述します。 <script type="text/vnd.graphviz" id="cluster"> digraph G { subgraph cluster_0 { style=filled; color=lightgrey; node [style=fill
Maplace.js - 軽量なjQuery × Googleマップライブラリ MOONGIFT
Googleマップをプログラマブルに組み込むのに良さそうです。 GoogleマップはAPIの多彩さ、機能の柔軟さもあって様々なサービスで使われています。位置情報や地図を扱おうと思ったら一番に考えるのではないでしょうか。 そんなGoogleマップをさらに手軽に使えるようにしてくれるライブラリがMaplace.jsです。機能は限られますが広範囲に利用できそうです。 まずは簡単なデモ。地図の表示を行います。コードとしてはたった数行です。 // JavaScript var maplace = new Maplace(); maplace.Load(); // or new Maplace().Load(); // HTML <div id="gmap"></div> その結果は次のようになります。 シンプルな地図表示。 次はドロップダウンやリストを使ったマーカーのデモ。マーカーは自動的に中央に表
this, is boomerang
ブーメランは必ずもどってくる、何かにぶつからない限り。 ブーメラン？ boomerang は小さな JavaScript からなり、あなたのウェブページに埋め込まれ、ユーザーの視点からあなたのウェブページのパフォーマンスを測定する場となります。さらに解析するには取得したデータをあなたのサーバーに送信する必要があります。boomerang を使えば、ユーザーがあなたのサイトがどれくらい速度で見ているかを正確に知ることができます。 boomerang は BSD ライセンス のもとでオープンソースとして公開されています。我々は boomerang に関する多くのドキュメントを提供します。 使い方 ユースケース — 我々が考えられる boomerang の用途のほんの一部 機能概要 — boomerang の仕組みと簡単な説明 ヘルプやバグの共有 — コミュニティの提供 TODO — 私たちには
JavaScript文字列のエスケープ
これらの中で注目すべきは ‘ と ” と \ です。シングルクォート、ダブルクオートは文字リテラルを作成する為に利用され、\ でエスケープできることです。つまり、文字リテラルの最後に \ が現れると文字列の終端が無くなります。単独で不正なJavaScriptの挿入が可能になる訳ではありませんが、プログラムの構造が破壊される事を意味します。 PHPにはJavaScript文字列用のエスケープ関数が用意されていません。htmlspecialchars()やhtmlentities()で代用している場合も多いと思います。しかし、これらの関数ではJavaScript文字列のエスケープを十分に行う事ができません。 JavaScriptプログラムの構造が破壊される例 <?php $msg1 = 'test string\\'; $msg2 = ');alert(document.cookie); //
AngularJSの設計思想 [Google I/O 2013] - ワザノバ | wazanova.jp
[Video] https://www.youtube.com/watch?v=HCR7i5F5L8c AngularJSのHype (盛り上がり感)があるようなので、GoogleのMisko HeveryとBrad GreenがGoogle I/O 2013でAngularJSの設計思想について語っているのを紹介します。 アプリ開発は、雛形構文（ボイラープレート）を利用しながらデータをブラウザとDBの間でやりとりさせるのが中心で、気づいてみると同じ雛形構文を書く作業をかなり繰り返している。コードを書いてる時間よりもコードを読んでいる方に時間がとられることも多い。この雛形構文を使った作業を極力減らして、アプリに付加価値をもたらすコーディング作業だけを抽出したいと思った。 コーディング作業が効率的になる構造が欲しかった。 フレームワークにテストを組み込むが、フレームワーク自身をきっちりテスト
様々なブラウザ環境に対応する為のJavaScriptライブラリ「Modernizr」
配布元：Modernizr ライセンス：MIT & BSD licenses. ModernizrはTwitterなどの大手サイトでも採用されているブラウザの機能の実装状況を調査するためのJavaScriptライブラリです。 たとえばModernizrを読み込んだサイトではhtml要素が次のように書き換えられます。 <html lang="ja" class="no-js"> ↓ <html lang="ja" class="js flexbox flexbox-legacy rgba hsla multiplebgs backgroundsize borderimage borderradius boxshadow textshadow opacity cssanimations csscolumns cssgradients cssreflections csstransforms c
Modernizr: the feature detection library for HTML5/CSS3
MENURespond to your user’s browser features.Modernizr tells you what HTML, CSS and JavaScript features the user’s browser has to offer.Add your detects Development build What is Modernizr?It’s a collection of superfast tests – or “detects” as we like to call them – which run as your web page loads, then you can use the results to tailor the experience to the user. Why do I need it?All web develope
ユーザーの体感速度を高めるためのJavaScriptチューニング（前編）
連載「Webサイト・アプリ高速化テクニック徹底解説」第2回は、JavaScriptの高速化について、まずは前編、後編に渡ってユーザーの体感速度を向上させるための方法を紹介します。JavaScriptの同期・非同期の仕組みやscript要素のasync属性、defer属性について詳しく解説します。 今回から複数回に分けて、JavaScriptの高速化をテーマに解説していきます。まずは、ユーザーの体感速度を高めるためのJavaScriptチューニングということで、単純なJavaScriptの構文によるスピードを比較するようなものではなく、主にユーザー視点からの高速化を主眼に解説します。その中で、同期・非同期といったJavaScriptの仕組みやscript要素のasync属性、defer属性などについても触れていきます。 ユーザーの体感速度を向上させる 一概にJavaScriptの高速化といっ
最強オブジェクト指向言語 JavaScript 再入門！
この資料では、JavaScript でオブジェクト指向プログラミングを行う際に備えておくことが望ましい、基礎知識や概念について解説します。 【対象者】 ・JavaScript でアプリケーションを構築できる方 ・JavaScript におけるオブジェクト指向プログラミングの 実現手法や原理への理解を深めたい方 ・Java 的なクラスベースの言語との違いに違和感や混乱を 感じてらっしゃる方
Chartkick - Create beautiful JavaScript charts with one line of Ruby
<%= line_chart @goals.map { |goal| {name: goal.name, data: goal.feats.group_by_week(:created_at).count} } %> or <%= line_chart Feat.group(:goal_id).group_by_week(:created_at).count %> Say Goodbye To Timeouts Make your pages load super fast and stop worrying about timeouts. Give each chart its own endpoint. <%= line_chart completed_tasks_charts_path %> And in your controller, pass the data as JSON.
PhantomJSを試してみる - 偏った言語信者の垂れ流し
スクレイピングとかテストに便利ってことで聞いてたPhantomJSを試してみる。 PhantomJSはヘッドレスのWebKitをJavaScriptAPIで使えるようにしたもの。ライセンスはNewBSD。 PhantomJS | PhantomJS PhantomJSにはJavaScriptの実行環境が含まれているが、Node.jsではなくWebKitのJavaScriptCoreらしい。 which javascript engine is used by phantomjs? - Google グループ Node.jsを使っていない理由はPhantomJSのFAQに書いてあった。 FAQ | PhantomJS PhantomJSをNode.jsから使えるようにラップしたモジュールはサードパーティでいくつかあるらしい。 インストールして動かしてみる インストールは、Windows, M
『PhantomJSを使ったスマホサイトテストの自動化(前編)』
1 pixel｜サイバーエージェント公式クリエイターズブログ サイバーエージェントのクリエイターの取り組みを紹介するオフィシャルブログです。最新技術への挑戦やサービス誕生の裏話、勉強会やイベントのレポートなどCAクリエイターの情報が満載です。 みなさんこんにちは！ スマホ版Ameba担当の川口です。 ちょうど一年前、同じようにJavaScriptを使ったテスト手法について記事を書かせていただいたのですが、今回も懲りずにまた同じようなテーマで再登場いたしました。 JavaScriptのテスト手法 さて、スマホ版Amebaの全面リニューアルから早くも１年経ったのですが、今回はそんなスマホ版Amebaで日々自動テストツールとして活躍してもらっているPhantomJSを紹介させていただきます。 長い記事になるため、今回は前編・後編に分けて以下のような構成でお送りいたします。 ●前編 ・Phanto
フロントエンドWeb戦略室 記事一覧 | gihyo.jp
第1回外部サイトに貼り付けるJavaScriptの作法―ポリシー、速度、セキュリティ、プライバシー（3） mala 2012-07-04 第1回外部サイトに貼り付けるJavaScriptの作法―ポリシー、速度、セキュリティ、プライバシー（2） mala 2012-07-03
GAのクッキー情報を手軽にJS変数として使う「ga.utils.js」 - Web Analytics Latte
GAのクッキーって結構複雑で扱いにくいんですが、それをJSから簡単に取得できるようにしてみました。GAを使っているサイトのユーザーで、GAのクッキーを持っていればだいたい使えます。 ga.utils.jsです。 これは何 以下の情報を取得できます： ・ユーザーがリピーターか否か ・何回目の訪問か(セッション数) ・前回の訪問から何日経ったか ・今回のセッションで何ページ閲覧しているか ・cookie内のトラフィックキャンペーン ・cookie内のトラフィックメディア ・cookie内のトラフィックソース 使い方 使い方は簡単です。上記リンクからJSをダウンロードして、サイトで読み込んでください(headでもbodyでも)。その後、取得したい情報に応じてJSを呼び出します。 <script type="text/javascript"src="ga.utils.js" charset="ut
asm.js:コンパイラのための低レベルかつ高度に最適化可能なJavaScriptのサブセット
JavaScriptのサブセットとして静的型付け言語を定義し、事前コンパイルを可能にすることでJavaScriptの実行速度を劇的に改善しようというasm.jsの概要を、1つ前の記事で調べました。 まだasm.jsの情報は少ないのですが、その中でも分かりやすくまとまった記事がDevon Govett氏のブログBADASS JAVASCRIPTのエントリ「asm.js: A Low Level, Highly Optimizable Subset of JavaScript for Compilers」です。 Govett氏に翻訳の許可を得たので、翻訳記事として掲載します。 asm.js: A Low Level, Highly Optimizable Subset of JavaScript for Compilers MozillaのDavid Herman、Luke Wagnerそして
まるでネイティブのようなUIを実現できる高機能JavaScript UIライブラリ·w2ui MOONGIFT
w2uiはデスクトップ、スマートフォン、タブレットに対応したJavaScript UIライブラリです。 新しいJavaScript UIライブラリの紹介です。名前はw2ui、多数のウィジェットを搭載したUIライブラリとなっています。 レイアウト。 グリッド。 詳細検索対応。 ツールバー。 サイドバー。階層表示に対応しています。 タブ。 フォーム。 ポップアップ。 ツールチップ。 その他ユーティリティ。 w2uiのサイズは37KB（ミニファイ&Gzip）で、これはExtJSの1/12、Kendo UIの1/6となっています。また、jQueryベースという特徴、全てのウィジェットをまとめて提供、IE9、Firefox7、Google Chrome、Safari5に対応となっています。デスクトップはもちろん、タブレットやスマートフォンにも対応しています。 w2uiはJavaScript製、MIT
や...やっと理解できた！JavaScriptのプロトタイプチェーン - maeharinの日記
JavaScriptのプロトタイプチェーンについて理解しようとしたのだけど、prototypeとか__proto__とかごちゃごちゃになって、色んなブログを読んでもなかなか理解しきれなくて悶々としていたのだが、図を書いたらパッと理解できた！以下、情報ソースはなるべくECMAScript仕様書（3rd）を元にするようにして書きました なぜ分かりづらいのか？ そもそも、なぜJavaScriptのプロトタイプチェーンは自分にとってこうも分かりづらかったのだろうか？自分なりに分析してみると、まず、「似ているが違う用語が沢山ある」という点がある。ざっとあげただけでも、「prototypeと__proto__」「__proto__と[[Prototype]]」「FunctionとFunctionオブジェクト」などがある。そして次に、「入り組んだ構造が動的に変化する」という点がある。上記のように似たよう
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://www.hp-stylelink.com/news/2013/10/20131008.php
http://www.famo.us/
