タグ

JavaScriptに関するtaky1973のブックマーク (173)

  • HTML5のscript要素でasync, deferを使ってパフォーマンスアップ - IT-Walker on hatena

    http://code.google.com/speed/articles/html5-performance.html JavaScriptの高速化手法を紹介する、Googleプロジェクト「speed」がリニューアルしたと言うので見てたら、「HTML5でパフォーマンスアップ」てなタイトルがあったので「なぬ?」と思って読んでみました。 HTML5使ってもそんな効力得られないだろう・・・と思って読んでみたら、「HTML5の記法を使えばnバイト節約」みたいなチョコザイな手法が主だったのでちょっと苦笑(^^; とはいえ、script要素に今度から加わるasync属性について等は、日語で説明されている記事がほとんどないので、全体的に要約しておきます(あくまで翻訳ではなくて要約。時間がないので超適当です。正確なところは原文を読んでください)。 DTD HTML4までは以下のように書かなきゃいけな

  • 次世代JavaScriptを“いま”実現するグーグルの「Traceur」

    現在仕様策定中の次世代JavaScriptが備えるであろうクラスの継承やモジュール化機能を、いまのJavaScriptで実現するコンパイラ「Traceur」をグーグルが公開しました。 traceur-compiler - Google's vehicle for Javascript Language Design Experimentation - Google Project Hosting TraceurはJavaScriptで記述されたコンパイラとして実装されており、オンザフライでTraceur対応JavaScriptを現在のJavaScriptに変換、実行します。 具体的には、HTMLの先頭で「traceur.js」を読み込んでおくと、そのWebサイトではそれ以後、Traceur対応のクラスやモジュール化機能を備えた次世代JavaScriptをそのまま実行できる、ということになり

    次世代JavaScriptを“いま”実現するグーグルの「Traceur」
  • HTML5時代が目前! 本気で学ぶJavaScript

    登場当時、動きのあるWebページを作る技術として注目されたJavaScriptは、その後“不遇”の時代を経て、Ajaxで再び脚光を浴びました。jQueryなどのライブラリの普及で、開発生産性やブラウザ互換性の問題がほぼ解決した現在、HTML5時代を目前にして、JavaScriptの重要度はさらに高まっています。この特集では、今、知っておきたいJavaScriptを一気に解説します。 目次

    HTML5時代が目前! 本気で学ぶJavaScript
  • HTML5ビデオの内容に併せて他コンテンツを連動させて切り替えられるフレームワーク「Popcorn.js」:phpspot開発日誌

    HTML5ビデオの内容に併せて他コンテンツを連動させて切り替えられるフレームワーク「Popcorn.js」 2011年03月10日- Popcorn.js | The HTML5 Video Framework HTML5ビデオの内容に併せて他コンテンツを連動させて切り替えられるフレームワーク「Popcorn.js」 例えば、ビデオ映像の位置を別のブロック要素でGoogle地図で表せたり、ビデオの内容にあわせてTwitterのタイムラインを流したりと、将来的に色々なところでこういった見せ方が見られるのでは?というもので一見の価値はあります。 独自のブラウザベースのオーサリングツールによって、映像と連動要素の組み立ても簡単。 TwitterFlickrGoogle地図に既に対応していますが、プラグインベースなので今後も拡張していくみたい。 映像の位置を地図で別ブロックに表示する例 ビデオ

  • Node.jsを手軽に試せるJavaScript統合開発環境「Cloud9 IDE」、クラウドでの提供開始

    Node.jsを手軽に試せるJavaScript統合開発環境「Cloud9 IDE」、クラウドでの提供開始 オープンソースとして開発されているJavaScript統合開発環境の「Cloud9 IDE」が、クラウド上のサービスとして提供開始されました。Cloud9 IDEサービスを立ち上げたのは、Cloud9 IDEの開発元でもあるAjax.org。 Cloud9 IDEは、Node.jsが動作するサーバの上にWebアプリケーションとして実装された、Node.js対応のサーバサイドJavaScriptのための統合開発環境です。Node.js上に実装されたということはつまり、Cloud9 IDE自身もJavaScriptで記述されています。 Node.jsを試してみたいけれど、自分でインストールしたり環境を構築するのは面倒、という人にちょうどいいのではないでしょうか。 Cloud9 IDEサー

    Node.jsを手軽に試せるJavaScript統合開発環境「Cloud9 IDE」、クラウドでの提供開始
  • SEOにも強いクローラブルなAJAXコンテンツを作成するために :: 5509

    AJAXコンテンツが増えるにつれて問題になるのは、SEOというか、検索エンジンにどうクローリング、インデックスさせるのか、という点ですよね。 この前JavaScriptの実装を担当した松クリニックは、AJAXでほぼ全てのページを切り替えるっていうのが最大のポイントなんですけど、これの良いところはWordPressで全てのページを生成してて、JSオンでもオフでも見られるんですね。つまり、クローラはオフのコンテンツを見るような作りにしてあります。 で、こういうのって小規模~中規模なサイトならまだいいと思いますけど、大規模なサイトになってきたりするとページは存在しないでデータだけが存在したりする(ハンドラにリクエストをかけてJSONだけを返してもらって内容を入れ替える、など・・・)わけで、実現が難しくなるんですね。 この問題に対してGoogleが現在公表している方法は、HTML snapsho

  • AJAX クロール: ウェブマスターおよびデベロッパー向けガイド - ウェブマスター ツール ヘルプ

    概要 検索結果に表示したいコンテンツで AJAX アプリケーションを実行している場合、Google が新しく作成したプロセスを実装すると、Google によるサイトのクロールとインデックス登録が可能になります。このプロセスは、Google 以外の検索エンジンでもうまく機能する可能性があります。AJAX コンテンツはブラウザによって動的に生成されるためにクロールで検出することができず、検索エンジンで AJAX アプリケーションを処理することは困難でした。この問題に対応するメソッドも既にありますが、このメソッドでコンテンツを最新の状態に保つには、手動で定期的に保守を行う必要があります。 一方、以下のスキームでは、検索エンジンでスケーラブルにコンテンツをクロールし、インデックスに登録できます。また、ウェブマスターが継続的に手動で保守を行わなくても常に最新のコンテンツがインデックスに登録されます。

    taky1973
    taky1973 2011/02/25
    AJAXを使ったページを検索エンジンにきちんと認識させる方法。ハッシュフラグメントを…
  • Titanium mobile で開発を始める時に役立つ情報のまとめ | astronaughts.net

    かなり熱くなってきた Titanium mobile 去年あたりから JavaScriptiPhoneAndroid のネイティブアプリが開発できる Titanium mobile が注目を集めています。実は僕も、この Titanium mobile を使用してアプリを開発しています。まだ何もリリースできていませんがっw Titanium mobile の情報は、有志の方々がドキュメント等を日語でまとめてくださっているんですが、まだまだ細かい情報が少なく、分散してしまっているのが現状のようです。 そこで、自分が集めた情報を一度まとめてみました。これから Titanium mobile を触ってみようと思われる方は一度目を通してみてください。 Titanium mobile 入門関連 まず Titanium mobile を触る前に必ず見ておきたいサイトです。 チュートリアル

  • DOMから始めるJavaScriptモダン・スクリプティング---目次:ITpro

    近年,Ajaxの台頭をきっかけに,JavaScriptを使ったブラウザのリッチ・クライアント化が進んできました。現在では,ページの表示を変化させるだけであれば,ほとんどのことはJavaScriptのみで対処することが可能です。それを実現するのがDOMなのです。 第1回 DOMから始めるモダン・スクリプティングの世界へようこそ 第2回 ブラウザからHTMLはどう見えているかを理解しよう ~ドキュメントツリー~ 第3回 DOMスクリプティングのことはじめ(1) ~要素(タグ)を狙い撃ち~ 第4回 DOMスクリプティングのことはじめ(2) ~これはどんな要素?~ 第5回 DOMを使ってHTMLを自由自在に書き換える 第6回 イベントハンドラから脱却しよう 第7回 スクリプトを完全に分離しよう ~コンテンツ,プレゼンテーション,ビヘイビア~ 第8回 スクリプトのパッケージ化 ~使い回しできるスクリ

    DOMから始めるJavaScriptモダン・スクリプティング---目次:ITpro
    taky1973
    taky1973 2011/02/24
    良記事。jQueryは使わない基礎的なこと
  • js dokusho

    大阪javascript読書

  • for 文を setTimeout に変換する - IT戦記

    for 文で 100 項目とか 1000 項目とかあるテストケースを処理するとブラウザが固まる。 こんなダイアログが表示されます。 ということで for 文を setTimeout や setInterval に変換する事で定期的にブラウザに処理を戻すことができる。 // ここでは console.log のところでログを取ってますが // 通常は処理が入ります。 for (var i = 0; i < 3; i ++) { console.log('a' + i); } /* * 結果 * a0 * a1 * a2 */ これをまず while 文に変換 var i = 0; while (true) { if (!(i < 3)) break; console.log('a' + i); i ++; } /* * 結果 * a0 * a1 * a2 */ で、 setTimeout に

    for 文を setTimeout に変換する - IT戦記
  • 外部JavaScriptの動的ロード - os0x.blog

    JavaScriptからJavaScriptを読み込むのは、(IEに対応する場合は特に)結構面倒です。 ちょうど昨日公開されたid:amachangのはてブにアクセスチャートを出す Greasemonkeyでは、こんな実装になっていました。 // for IE if (!document.evaluate) { var script = document.createElement('script'); script.src = 'http://svn.coderepos.org/share/lang/javascript/javascript-xpath/trunk/release/javascript-xpath-0.1.11.js'; document.body.appendChild(script); var callee = arguments.callee; var inter

    外部JavaScriptの動的ロード - os0x.blog
  • Postal Search APIs & Solutions

    Postal Search APIs & Solutions とは Postal Search APIs & Solutions は、郵便番号と住所を軸に様々なデータを検索できる API の提供と、その API を活用したアプリケーションの提案や事例 を紹介するサービスです。おかげさまでサービスは、2008年3月31日をもって1周年を迎えることができました。応援してくださったみなさん。ありがとうございました。 Postal Search APIs & Solutions は、利用者のフィードバックを尊重しながら進化し続けたい BETA サービスです。Postal Search Ajax API という郵便番号から住所、住所から郵便番号を検索できる JavaScript ベースの API と、その API を使ったサンプルを提供します。さらに、WEB サーバに Postal Search

    taky1973
    taky1973 2011/02/18
    Postalcode→←郵便番号 のAJAX。jQueryなどの技術情報も
  • 無名関数をすぐに実行する(function(){})()の覚え書き [JavaScript] : ずっと工事中

    題に入る前に、 普通に関数を作って実行するとき var foo = function() { … }; foo(); としますよね。 この動作を普通に説明すると、 無名関数をfooに代入 fooを実行 という感じになりますが、もう少し細かく分解して、 function(){}はその関数の参照を値に持つ JavaScriptでは、functionの代入は参照を渡すので、 var foo = function() { … }; は左辺のfunction(){}は、自身への参照値を持ち、 それをfooに代入 していることがわかります。 関数の参照にカッコ()を付けると、関数を実行する 次に、普段なんとなく使っている foo(); これは foo(参照)に演算子()を付けると、関数が実行される …という事をあらわしていますね。 ということで、fooもカッコを付けないと参照だし、function(

  • カラーピッカー.js - JavaScript ライブラリー - HTML5.JP

    対応ブラウザー Internet Explorer 6 以上 Firefox 2.0以上 Opera 9.0以上 Safari 3.0以上(もしかしたら2.0でも動作するかもしれませんが、未確認です。) Google Chrome 0.3以上 使い方 cpick_x_x_x.zipを解凍し、html5jpフォルダをウェブサーバにそのままアップロードしてください。そしてHTMLのhead要素内に、cpick.jsをロードするようscriptタグを記述しておきます。このサンプルは、html5jpフォルダが一階層上に存在しているものとしてscript要素のsrc属性を指定していますが、html5jpフォルダ はどこに設置しても構いません。html5jpフォルダの設置場所に合わせてcpick.jsをロードするscript要素のsrc属性を書き換えてください。

  • これでできる! クロスブラウザJavaScript入門 記事一覧 | gihyo.jp

    運営元のロゴ Copyright © 2007-2025 All Rights Reserved by Gijutsu-Hyoron Co., Ltd. ページ内容の全部あるいは一部を無断で利用することを禁止します⁠。個別にライセンスが設定されている記事等はそのライセンスに従います。

    これでできる! クロスブラウザJavaScript入門 記事一覧 | gihyo.jp
  • イヌでもわかるJavaScript講座

    このJavaScript講座はプログラミング知識がない人もサンプルをただ埋め込めば使えるように作られています。ステップの段階で少しずつJavaScriptを説明していきますので、各ステップの内容がすべて把握できなくても、あとでわかってくると思います。えっ?と思う個所があっても、それはそのステップの趣旨ではないところですので、その個所はどこかのステップで説明します。深く考え込まずに、各ステップを適当にすすめていってください。 なお、講座のサンプルを使ってHTMLファイルがぶっ壊れたり、マシンから煙や火が出ても一切責任を負いません。バックアップはこまめにしましょう。(^^; また、サンプルを無断で使用することを禁じるわけがありません。勝手に許可無く使ってください。

    taky1973
    taky1973 2011/02/14
    転載O.K.のサンプル多数
  • JavaScript Index/メソッド、プロパティ・リファレンス

    scollabo.com is coming soon This domain is managed at

  • javascript: escape(), encodeURI(), encodeURIComponent() 比較 (groundwalker.com)

    « DoBeDo 2.5 | メイン | javascript で Query String » javascript: escape(), encodeURI(), encodeURIComponent() 比較 javascript の escape(), encodeURI(), encodeURIComponent() 関数群について、どの文字がエンコードされてどの文字がエンコードされないのか分かりにくいのでまとめておく。 まずは、対象範囲 %20(半角スペース)〜%7E(チルダ~) 元データ !"#$%&'()*+,-./ 0123456789 :;<=>?@ ABCDEFGHIJKLMNOPQRSTUVWXYZ [\]^_` abcdefghijklmnopqrstuvwxyz {|}~ escape() %20%21%22%23%24%25%26%27%28%29*+%2C-

  • JSON の紹介

    JSON (JavaScript Object Notation)は、軽量のデータ交換フォーマットです。人間にとって読み書きが容易で、マシンにとっても簡単にパースや生成を行なえる形式です。 JavaScriptプログラミング言語 (ECMA-262標準第3版 1999年12月)の一部をベースに作られています。 JSONは完全に言語から独立したテキスト形式ですが、C、C++、C#、JavaJavaScriptPerlPython、その他多くのCファミリーの言語を使用するプログラマにとっては、馴染み深い規約が使われています。これらの性質が、 JSONを理想的なデータ交換言語にしています。 JSONは2つの構造を基にしています。 名前/値のペアの集まり。様々な言語で、これはオブジェクト、レコード、構造体、ディクショナリ、ハッシュテーブル、キーのあるリスト、連想配列として実現されています。