RightJS RightJSと他ライブラリとの比較 IE, Fx, Op, Safari, Chromeの各ブラウザでのパフォーマンスは、jQuery、Prototype、Mootoolsなどの主要なJavaScriptのライブラリと比較して、概ね高速なパフォーマンス結果となっています。 デモではモーフィング、ハイライト、フェード、スライドなどのビジュアルエフェクトを楽しめます。 demo RightJSのライセンスは、MIT licenseとのことです。
RightJS RightJSと他ライブラリとの比較 IE, Fx, Op, Safari, Chromeの各ブラウザでのパフォーマンスは、jQuery、Prototype、Mootoolsなどの主要なJavaScriptのライブラリと比較して、概ね高速なパフォーマンス結果となっています。 デモではモーフィング、ハイライト、フェード、スライドなどのビジュアルエフェクトを楽しめます。 demo RightJSのライセンスは、MIT licenseとのことです。
Intro 誕生と言うのが正しいか微妙だけど、多分誕生でいいと思います。 というのも、「Ajax」という名前の出典は以下の記事で、この記事が書かれたのが今日からちょうど 10 年前でした。 Ajax: A New Approach to Web Applications (当時から、 URL が一回変わっている) Web 初めてまだ 10 年たって無いんで、全部見てきたってわけではないですが、個人的にはちょっと思い出深い記事だったりするので、ちょっと振り返ってみます。 Ajax: A New Approach to Web Applications 筆者の Jesse James Garrett 氏は UX のコンサルティング会社である Adaptive Path の創立メンバーの一人で、 UX エンジニアです。 この記事の趣旨は、当時既にあった Google Maps や Gmail、G
Tim Bray氏のブログ記事を解説したものです。Tim Bray氏はXMLの生みの親であり、最近はGoogle Developer AdvocateとしてAndroidの普及に務めています。Twitterをはじめ、最近のWebサービスにて「twitter.com/#!/timbray」のようにURLに「#!」というhash-bang(shebang)が含まれるのをよく目にしますが、Tim氏はこの流行に批判の意を示しています。 hash-bangを含むURLはAjaxを利用するために考えられたしくみです。#以降は単なるフラグメントとして処理されるため、サーバは#より前のURLを解釈しコンテンツを出力します。そしてブラウザにてJavaScriptが#以降を解釈し、以降のパスに相当するコンテンツをAjaxにて取得しコンテンツを書き換えます。このしくみができた背景は、Ajax後のコンテンツをSE
TOPICS Programming , Web , Security 発行年月日 2008年02月 PRINT LENGTH 284 ISBN 978-4-87311-358-6 原書 Securing Ajax Applications FORMAT Ajaxは、昨今のWebサービスでは欠かせないものとなっていますが、そのインタラクティブ性の高さゆえに多くの脆弱性を抱えており、セキュリティがますます重要になってきています。本書はAjaxアプリケーションをはじめ、Web 2.0関連のテクノロジやWebサービス全般に関しても幅広くカバー。セキュリティに関する基本知識やWebアプリケーションの持つ脆弱性にも詳しく触れています。実際に多数のアクセスを集めているWeb 2.0サイトでのケーススタディなども交え、安全なWebアプリケーションを構築するために必要な知識をコンパクトにまとめています。
JSONPの動作原理 前回はAjaxに存在するセキュリティモデルであるSame-Originポリシーを紹介し、そのSame-Originポリシーを迂回する方法とセキュリティについて見てきました。また、回避する方法の1つめとしてリバースProxyを用いた方法を紹介しました。リバースProxyを用いた方法ではセキュリティ的な問題点もありましたが、そもそもProxyサーバを用意しなければならないため、この方法は手軽に使うことはできませんでした。 そこで考え出されたのがJSONP(JavaScript Object Notation with Padding)という方法です。 それではまず簡単にJSONPについて説明します。 Ajaxで使われるXMLHttpRequestオブジェクトには前回説明したとおりSame-Originポリシーがありクロスドメインアクセスはできません。一方、SCRIPTタグ
第11回ガジェット、ウィジェットのセキュリティ 福森大喜 2007-11-14
第1回ではJSONPによるAjax実装を取り上げましたが、今回はそこで使ったJSONという表記法と、JSONPというAjax実装手法について解説します。また、jQueryによる簡単なAjaxの実装についても解説します。 JSONってなに? JSONとは、JavaScript Object Notationの略称です。ECMAScript言語 ECMA-262をベースに作られた、Javascriptオブジェクトの表記法のサブセットです。 JSONは、名前と値のペア、および、順序付きの値という2つのシンプルな構造に基づいて、構造化データを簡潔に表現することができます。 オブジェクト(名前と値のペアの集まり) JSONでオブジェクトを表現するには、メンバを「{」と「}」で囲みます。複数のメンバは「,」で区切られます。例えば、名前が「color」、値が「green」というメンバを持つオブジェク
こんにちは、太田です。今回から、Ajaxと呼ばれるような非同期な通信処理を行うJavaScriptについて解説していきます。今回は特にJSONPについて基礎的な部分を解説します。 JSONとは JSONについては第9回でも少し触れていますが、改めて解説します。 JSON(JavaScript Object Notation)はJavaScriptから生まれたデータ記述フォーマットで、真偽値、数値、文字列、null値の組み合わせを持ったハッシュか配列かその両方で構成されます。 JSONはそのシンプルさから多くの言語でネイティブにサポートされており、特にウェブ関連ではポピュラーなデータフォーマットです。 JSONのサンプル(配列) ["aaa", "bbb", "ccc"] JSONのサンプル(ハッシュ) {"aaa":1, "bbb": 2, "ccc": 3} JSONのサンプル(ハッシュ
はじめに 初めまして。NTTアドバンステクノロジの金城と申します。幸運にも記事を執筆させていただけることになりました。WebSocketという新しいウェブの規格についての連載を、全4回の予定でお届けします。 用語統一について WebSocketは「WebSocket」「WebSockets」、単語を切り離した「Web Socket」等、表記に揺れがあります。2009年12月22日のワーキングドラフトのタイトルは「The Web Sockets API」となっていますが、2010年4月26日のエディターズドラフトでは「The WebSocket API」となっています。この連載では、最新の仕様書に則り、用語を「WebSocket」で統一します。 HTML5とWebSocketの関係 WebSocketは、もともとHTML5の一機能として仕様の策定が進められていました。しかし、Web S
JavascriptやjQueryを書いていると、「この処理がちゃんと終わってから、こっちの処理を始めたい!」って場面に結構遭遇するのではないかと思います。特にアニメーションを作っているときによくあるのではないでしょうか。 コールバック関数を設定出来る処理なら簡単なのですが、それがないものも結構あったりします。僕が困ったのは.html()や.ajax()でした。なんかいい解決策は無いかなーとググってみたところ.when().done()という処理の仕方が良さげだったので使ってみたらばっちりでした。 .when()には先に終わらせたい処理を書く ざっくりとした説明の仕方をすると、.when()には先に完了させたい処理をまとめて書いておきます。例えば、“横に移動したら、フェードアウトする”みたいな事をしたい場合、“横に移動したら”の部分を.when()の中には書きます。 (まあ、そんな簡単な動
グラフ作成ツールが人気ですよね。べつやくメソッドも地位を確立しつつあります。 さてそうした流れを受けてご紹介したいのがEJSChart。Javascriptだけで実現できるグラフ作成ツールです。 残念なことにまだ公開前なので全容は不明ですが、やたら高機能らしいです。 ズームやスクロールが可能であるばかりか、マウスイベントを拾ったり、ヒントの表示などもサポートしている模様。ぐっとインタラクティブな表現が可能になりそうですね。 また、グラフの種類も豊富、かつ、XMLによるデータ連携もできるようです。 サイトから推測するに有料かと思われますが、早く試してみたいところですね。
Enterprise x HTML5 Web Application Conference 2014の発表資料です。
Before visitors click on a link, they hover over that link. Between these two events, 200 ms to 300 ms usually pass by (test yourself here). 引用:InstantClick — JS library to make your website instant リンクにマウスオーバーしてからクリックするまでには200msから300msほど時間がかかるそうです。実際このテストページでクリックしてみるとMacのトラックパッドだとさらに遅く500msくらいかかってました。 InstantClick.ioはその間に裏でリンク先ページをロードして勝手にリンクをpjax化してしまうという高速化ライブラリです。 やってることはRails4のturbolinksと似てます
なにかと便利なメッセンジャーであるが、自分のサーバーで運用したい、というニーズもあるだろう。そうしたときに便利そうなのがajax imだ。 このサイトではサーバーにインストールする、Ajaxを利用したメッセンジャープログラムをダウンロードすることができる(サーバー側はPHPで動作)。 デモを試してみればわかるが、スタイリッシュなインターフェースと軽快な動作がなかなか小気味良い。 サイトのユーザー向けにちょっとしたツールを提供、といった利用が可能だろう。またソースごとダウンロードできるのでプログラミングの勉強にも最適だ。 便利なツールを自分のサーバーで提供できるようにする。そうした発想は悪くないですね。
JavaScriptとPHPの通信 JavaScriptから見たPHPからのリクエストとPHPから見たJavaScriptからのリクエスト Ajaxを使わずにファイルマネージャを作ろう Ajaxを使わないでPHPファイルマネージャの概要と実装スタイル Ajaxを使ってファイルマネージャを作ろう Ajaxへの改変部分と注意点/ファイルマネージャの制限/Ajaxを用いたオープンソースのPHPアプリケーション/phpFreeChat/自前WebにphpFreeChatをコピーしてみよう JavaScriptはブラウザ上で実行されるインタプリタ言語である。PHPはサーバ上で実行されるインタプリタ言語である。JavaScriptとPHPのメッセージの流れは基本的に@IT上のほかの記事を参考にしてもらうといいだろう。 ■JavaScriptでの実装例 下記はJavaScriptからサーバ上のURL、「
本連載では、Ajaxを活用したインタラクティブなWebアプリケーションを、ゼロから開発する。3回の連載で、簡単なWebフォトアルバムを完成させる予定だ。完結した機能を持ったAjaxアプリケーションを作り上げるステップを、具体的に解説していきたい。 JavaScriptと非同期データ送受信を組み合わせた、Webアプリケーション開発スタイルである「Ajax」は、このキーワードが発表されたのが今年初めのことだとは思えないほどの発展を遂げており、日々新しい実験や、それを組み込んだサービスが発表されている。 そろそろ実際にAjaxを活用したWebアプリケーションを開発してみようか、と考えている開発者も多いことだろうが、ではAjaxで何をどう作ったらいいんだろう? という部分で立ち止まってしまってしまっているのではないだろうか。 そこで本連載では、単なるサンプルではなく、完結した機能を持ったAjaxア
Ajax推進委員会 監修:ゼロベース 2005/8/2 2005年2月半ばから、「Ajax」という言葉がアルファギークたちの間で一気に広まった。「Webインターフェイスの新しい手法」「画期的なWebアプリケーションの仕組み」であるとして開発者たちの人気を集めるAjaxとは何なのか、その真実を見極めてみよう。 Ajaxとは「Asynchronous JavaScript and XML」の略で、Webブラウザでの表示部分を含めたWebアプリケーションの作り方を指す名前だ。具体的にはXML形式のデータをJavaScriptで処理することで、ブラウザのHTTPによるページ遷移とは非同期にサーバとやりとりして「動的に」ページ内容を変更する仕組みを指す。 Ajaxを実現する詳細なコード例は後述するとして、まずはAjaxが実現するWebアプリケーションがどのような動作をするのか、既存のWebアプリケー
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く