JavaScriptコーディング等を書く上でのパフォーマンス確認事項３０:phpspot開発日誌
30 best practices to boost your web application performance - Web User Interface Architect JavaScriptコーディング等を書く上でのパフォーマンス確認事項３０。 自分へのインプット＆メモがてらにちょっとまとめてみます。 JavaScript DOMの操作は可能な限りやめる eval, new Function() は遅いので可能な限り使わない withステートメントを使わない（使った事ないですが） for-in 文ではなく for 文を使う。 ループの中で try-catch ではなく、try-catchの中にループを置く グローバル変数をなるべく使わない aaa+='AAA';aaa+='BBB'; の方が aaa+='AAA'+'BBB';より速い 複数の文字列連結には、Array で文字列
JavaScript + Canvas で動くカオスアトラクタ生成器作ってみた - mooz deceives you
カオスアトラクタ by edvakf in hatena を見ていて Canvas でピクセル操作が出来るらしいことを知り、早速カオスアトラクタ生成器を作ってみた。 アクセスは C.H.A.O.T.I.C C.A.N.V.A.S から。 動作は Firefox 3.5 と Google Chrome で確認。処理速度は Chrome の方が 5 倍ほど速いので、一応 Chrome 推奨。 Safari や Opera では未確認。 で、操作説明。 Draw ボタンを押せばカオスアトラクタが描画される。 Settings 右のプルダウンメニューにいくつかプリセットの設定を用意しておいたので、はじめはそちらを試されるのが良いと思う。 Coefficients の値をちょびっとづつ変えていくと、生成される画像が綺麗に変化していってくれる。一期一会な感じが小憎い。画像は Firefox なら右クリ
HTML/JavaScript/CSSをシェイプアップ！·Patu Digua MOONGIFT
HTMLやJavaScript、CSSを構造化して見やすく書こうと思うとインデントやスペースを使うだろう。確かに見やすいが、ブラウザへのレンダリングを行う上では特に意味はない（中には意味のあるスペースもあるが）。できるだけ転送量を抑えようと思うと、このスペースをなくしていくという作業が大事になる。 HTML/JavaScript/CSSのサイズを軽減 そのためのツール（難読化ツール）はいくつか存在するが、HTML/JavaScript/CSSのいずれにも対応したものは多くない。そこでPatu Diguaだ。 今回紹介するオープンソース・ソフトウェアはPatu Digua、HTML/JavaScript/CSSからスペースやコメントを排除するソフトウェアだ。 Patu DiguaはJavaで作られたソフトウェアで、Windows/Mac OSX/Linuxで動作する。指定したファイルからコメ
HTML5 enabling script
Since HTML5 is getting more attention by way of marking up our new pages, and the only way to get IE to acknowledge the new elements, such as <article>, is to use the HTML5 shiv, I've quickly put together a mini script that enables all the new elements. UK EVENTAttend ffconf.org 2024 The conference for people who are passionate about the web. 8 amazing speakers with real human interaction and cont
エヴァ携帯の50倍ワクワクする ドコモiモードブラウザ2.0の進化 | 初代編集長ブログ―安田英久
でした。フルブラウザを使う人はごく一部だったので、フルブラウザ前提でサイトを作るわけにもいきませんからね。 でも、iモードブラウザ2.0は、ブラウザとしての機能はiPhoneやアンドロイドと同等になり、表現力やユーザビリティをかなり高められるようになっていますよね。いや、FLVを利用できる分だけ、iPhoneよりも高い表現力をもつといえるかもしれません。 また、これまでドコモではできなかった、 外部CSSを使ってデザインしたりクッキーを使って会員ユーザーのセッションを管理したり携帯アクセス解析でもリファラーを調べたりといったことも、他のキャリアと同様にできるようになり、開発者の負担が減って良いことばかり。この変化には、エヴァケータイよりも興奮しませんか？ でも良いことばかりとは……ただし、iモードブラウザが高機能になって良いことばかりだとは言えないのも事実。 iモードブラウザ2.0を搭載し
Webページを速く見せるための5つのちょっとした工夫（1/3） - ＠IT
株式会社ライブドア マークアップエンジニア 浜 俊太朗 2009/4/30 ページ表示高速化をサーバの設定だけに任せていませんか？ HTMLやCSS、JavaScriptの書き方でも速くできます（編集部） 連載第1回の「Webサイトを“速く”表示させる7つの計測ポイント」では、YSlowを使って速度に関する問題を調査しました。 今回は、CSS・JavaScript・HTMLの工夫で速度を改善する下記5つの方法を紹介します。中にはYSlowの指摘に含まれないものもありますが、併せてチェックしていきましょう。 CSSはソースコードの上部に記述する JavaScriptはソースコードの下部に記述する CSSとJavaScriptを書く順番 JavaScriptを圧縮して読み込みを速くする 読み込みが遅いブログパーツには要注意 【1】CSSはソースコードの上部に記述する 連載第1回では、「CSSは
HTMLなどのソースを綺麗に表示するSyntaxHighlighterが2.0になってた
SyntaxHighlighter 以前からソースコードを見せるときはこれを使っていたのですが、バージョンが2になっているのには気づかなかった。２にバージョンアップして、表示が良くなったので、すぐにここでも使えるようにして導入してみた。 なにやら使い方が変わっている 以前はclassともう一つ設定することでsyntaxhighlighterが使えたけど、今回はclassだけでいいみたいだ。でも、デフォルトのままだと文法エラーになる記述が必要のようだ。おまけに以前の設定を全部変えないと使えないというデメリットも。。。 このバージョンアップから、class="brush:js;"のようにしないと使えないらしい。ってことで、以前の状態でも使えるように、こんなスクリプトを最初に読み込ませてみた。 $(function(){ $('pre.js').removeClass().addClass('b
技術系サイトに必需品！ ソースコードは鮮やかに (2/2)
Syntax Highlighterの使い方 Syntax Highlighterを使って構文を強調表示するには、以下の手順で行ないます。 まず、HTMLのヘッダー部分に次のような記述を追加して、Syntax HighlighterのJavaScriptとスタイルシートを組み込みます。 <script type="text/javascript" src="http://インストール先/scripts/shCore.js"></script> <script type="text/javascript" src="http://インストール先/scripts/言語別JavaScript.js"></script> <link type="text/css" rel="stylesheet" href="http://インストール先/styles/shCore.css"/> <link ty
技術系サイトに必需品！ ソースコードは鮮やかに JavaScriptもPHPもHTMLもOK！「Syntax Highlighter」の使い方
Webプログラミング/Webデザインのネタを扱うブログやWebサイトを運営していると、HTMLやCSSなどのソースコードを掲載することが多くあります。そんなときにぜひ活用したいのが、ソースコードを読みやすく表示してくれるJavaScriptライブラリです。今回は、そのうちの1つ、「Syntax Highlighter」の使い方を紹介しましょう。 多くの言語の構文強調表示に対応した「Syntax Highlighter」 HTMLなど各種言語のソースコードをWebページの中で表示するのは、HTMLのpre要素を使えば簡単です。ただ、ソースコードをそのまま表示すると、見た目が分かりやすくはありません。そこで、タグなど言語の特定キーワードに色を付けて、他の部分よりも強調して表示することで見やすくしましょう。 こういった「構文強調表示」を行なうJavaScriptは、いくつか公開されていますが、そ
新規でサイトを作るのに使えそうなの一式。Ver 3
随分前に、Ver2の見直しをして3になってたんですけど、公開してなかったので今更ながら公開です。 中身は2を使ってみて、社内のマークアップエンジニアからフィードバックもらったり、自分でも違和感が有った部分を調整してます。 それなりの期間使ってみて、問題をあんまり感じていないので、完成度としては大分良くなったかなぁって思います。 新規でサイトを作るのに使えそうな一式。Ver 3をDL（zip：40kb） Ver 3を見る Ver.3の中身ご説明 主な変更点を。 style.cssのwidthなどのプロパティをまとめていたのをVer1と同じに。 default.cssに書かれていた、p要素のmargin-bottomの指定をstyle.cssに移動。 default.cssのfont-familyの指定を若干変更。 index.htmlにGoogleカスタムサーチ用に使えるソースを記入。 Ja
ウェブサイトの開発に役立つスクリプトやスタイルシートのポータルサイト
DevSnippetsは、ウェブサイトの設計や開発に役立つ、HTML/CSS、JavaScript、AJAX、WordPressなどのスニペットのポータルサイトです。 DevSnippets DevSnippetsに登録されているスニペットのカテゴリは、以下の３つとなっています。 Design Elements CSS Techniques JavaScript Libraries ローンチして日が浅く、登録数は多くありませんが、今後に期待大です。 DevSnippetsは、現在総額$4600のコンテストも行っています。詳しくは下記ページを参照ください。 DevSnippets has Officially Launched with a $4600 Contest Prizes
iPhone対応サイトの作り方 - iPhone 3G Wiki*
DiffAnaとは？ iPhoneを買う前にiPhoneの魅力 iPhone安いって聞いたけど 初期設定はじめにやること MMSの設定 Eメール(i)設定 地域日時設定 iPod設定 MySoftbank登録 留守番電話関係 掲示板掲示板 アプリ一覧 Wiki編集局 FAQiPhoneのメールについて FAQiPhoneのパスワード FAQ操作編 FAQ初期編 →カメラ関係 →App Store（アプリ） →バッテリー・充電関係 →無線LAN・Wi-Fi関係 →USIM・キャリア関係 FAQメール編 FAQパケット料金編 FAQ重い メール着信関係 未解決問題 故障・修理 ホーム画面/アプリホーム画面 電話 写真 ビデオ・カメラ マップ（GPS） Safari(ブラウザ) Youtube iPod 時計 カレンダー ボイスレコーダー iBooks アプリ（AppStore） TIPS基本(
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
株式会社スタイルズ
作ろうiモード：iモードブラウザ2.0 | サービス・機能 | NTTドコモ
HTML/CSS, jQuery, WordPressなどウェブ制作者のためのチートシート集