node.jsで超カッコいいリアルタイムチャット「Balloons.IO」:phpspot開発日誌gravityonmars/Balloons.IO GitHub node.jsで超カッコいいリアルタイムチャット「Balloons.IO」。 次のようなインタフェースのリアルタイムチャットが作れるっぽいソースがgithubで公開されています。 カッコいいチャットを作りたい場合の１つの選択肢としてメモ 関連エントリ Node.js向けのPDF作成ライブラリ「PDFKit」 JavaScriptからPhotoshopファイルの情報をパースできる「psd.js」
pixiv の javascript のコメントが面白い - Dlog 隔離館
イラスト コミュニケーションサービス[pixiv(ピクシブ)] お絵描きサイト、pixiv！ 何気なく、pixiv の javascript のソースを眺めてみると、いろんなコメントがありました。 ニョーン ... 7686: // マウスオーバーでおすすめタグをニョーンと出す 7687: var timer = null; ... マジ天使 ... 452: selectCover: function(c) { 453: // [IE マジ天使] 送れないので遷移させる 454: if ($.browser.msie) { ... pixiv.group.js http://source.pixiv.net/source/js/pixiv.group.js なげえｗ ... 248: if (handler) { 249: // TODO 引数再考。なげえ 250: handler =
CDNでウェブサイトを高速化するためのまとめ
CDNでウェブサイトを高速化するためのまとめです。 「そんなの知ってるよ」という方も多いと思いますが、バージョンの指定方法や、キャッシュ・フォールバックなど、CDNに関する情報を集めましたのでご覧いただければ幸いです。 認識誤り等ありましたらどこかでつぶやいてください。 １．CDNとは CDNとは「Contents Delivery Network（コンテンツデリバリネットワーク）」または「Contents Distribution Network（コンテンツディストリビューションネットワーク）」のことで（注）、コンテンツを配信するために最適化されたネットワークを指します。 Wikipediaの「コンテンツデリバリネットワーク」の説明によると、次のサービス（企業）が著名な商用CDNサービスを提供しているようです。 Akamai Technologies Limelight Networks
どこまでも自由に情報をまとめる·Meshcraft MOONGIFT
Meshcraftは自由度の高いコンセプトマップエディターです。 Webはとても自由度が高いです。しかしHTMLという枠の中で行動を迫られます（FlashやJavaアプレットもありますが）。しかしそうした枠を超えてとにかく自由に情報を蓄積していけるソフトウェアがMeshcraftです。 トップページです。色々な枠やテキストが浮かんでいます。これらは自由に動かしたり編集したりできます。マウスで全体の視点を動かすこともできます。 登録フォームです。下の部分が大きくなるのはなかなか気持ちいい感覚です。 こんな感じで情報を結びつけることもできます。 新しい項目を追加します。左クリックで追加されます。 項目を追加した後、ドラッグで線を引きます。これでリレーションができます。 互いの関係性を明記します。 枠付きの他、ラベルも追加できます。 Meshcraftはコンセプトマップエディターという名称になっ
Twitter.comの読み込みが高速化 5分の1に短縮 - ITmedia ニュース
米Twitterは5月29日（現地時間）、Twitter.comをアップデートし、読み込みにかかる時間を従来の5分の1に短縮したと発表した。今週中に新生Twitter.comに切り替わる見込み。 まず、ページ上のパーマリンク（永続的なリンク）に含まれているハッシュバング（#!）を排除した。ハッシュバングはAjaxを利用するための仕組みだが、JavaScriptがパスを解釈する分、読み込みに時間がかかる。これを排除することで、パーマリンクの読み込みを速くしたという。 また、外部のWebサイト上でツイートのリンクをクリックしてからTwitter.comでそのツイートを表示するまでの時間を短縮するために、まずサーバでページのコンテンツをレンダリングしてからJavaScriptをロードするようにした。 さらに、JavaScriptのロード時間も短縮するために、コードを書き換えた。 Twitterは
(」・ω・)」うー!(/・ω・)/にゃー!encode
JavaScriptのコードを(」・ω・)」うー!(/・ω・)/にゃー!します。 変換後のコードはJavaScriptとして実行可能です。 元ネタは「這いよれ！ニャル子さん」と「aaencode」です。 解説：(」・ω・)」うー!(/・ω・)/にゃー!encode - kusano_kの日記 (」・ω・)」うー!(/・ω・)/にゃー!ises arbitrary JavaScript codes. The translated code can be executed as a JavaScript code. This tool has been inspired by 這いよれ！ニャル子さん and aaencode.
Webデザイナーのためのjquery入門2（前編）
82 views jQueryの社内勉強会用スライドです。だいたい1時間で終われるように、前編・後編に分けています。 後編は6月以降で公開を予定しています。 More… jQueryの社内勉強会用スライドです。だいたい1時間で終われるように、前編・後編に分けています。 後編は6月以降で公開を予定しています。 このスライドを作るにあたって、書籍「WebデザイナーのためのjQuery入門」をかなり参考にしています。 Webデザイナーのためのjquery入門2（前編） — Presentation Transcript Webデザイナーのための jQuery入門 -覚醒編（前編） -jQueryのコードを自分で考えて書けるようになろう！ 目標 日々の業務にjQueryを取り入れて、 自分で何かを作れるようになる。 大まかな内容１. 何かを取ってくる ２. それに何かをする３. まとめ 1
HTMLShell: Online HTML Editor | Toptal®
<!DOCTYPE html> <html> <head> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Hello!</title> <meta name="description" content="description"/> <meta name="author" content="author" /> <meta name="keywords" content="keywords" /> <link rel="stylesheet" href="./stylesheet.css" type="text/css" /> <style type="text/css">.body { width: auto; }</style> </head> <body> </body>
web高速化のためのコーダー向け圧縮ツール・サービスまとめ | バシャログ。
ゴールデンウィークは、ディズニーランドに連れていくと娘に約束してしまった ishida です。いったいどのくらい混雑するんだろう、どうせオイラはパレードの席取りでひたすら待つのさ。 さてさてweb高速化においてサーバー側ではなくフロントエンド側で対応できることもかなりあります。 CSSのセレクタ構文の最適化やCSSスプライトによる画像リクエスト数の削減であったり。 今回は、ファイル容量を削減に焦点を当てて圧縮ツール・サービスをまとめてみます。 Javascriptの圧縮 /packer/ http://dean.edwards.name/packer/ とってもシンプルな圧縮サービス。オプションで難読化することもできます。 JavascriptとCSSの圧縮 Compress javascript and css http://compressor.ebiene.de/ こちらもシンプルな
JavaScript圧縮・難読化の定番ツール「/packer/」
JavaScript圧縮・難読化の定番ツール「/packer/」を紹介します。直感的で動作も軽量です。 /packer/ 「定番」と書いた理由は、はてなブックマークでブレイクこそしていないものの、コンスタントにブクマされているためです（2012年4月22日現在で310ブックマーク）。 使い方は、圧縮・難読化したいソースコードを上のテキストエリアにペーストして、「Pack」をクリックするだけです。 圧縮・難読化されました。 圧縮率は下のテキストエリアの右下に表示されます。 オプションは「Base62 encode（英数字のみのエンコード）」と「Shrink variables（変数名の圧縮）」の2つが用意されています。このオプションを利用しないと空白・改行を除去するだけの動作になるので、圧縮率を上げたい場合はオプションを利用しましょう。 jQuery1.7.2.js（262285バイト）で2
1分でWebアプリを作れて、3分で公開できた！オールJavaScriptでWebアプリを開発できるMeteorを触ってみた - IT-Walker on hatena
もうJavaもRubyも要らない？–JavaScriptオンリーの未来派WebアプリフレームワークMeteorがデビューという記事で知った、新しいフレームワークMeteor。 ちょっと気になったので、軽く触ってみました。すごすぎるフレームワークの登場です！！ 正確に言うと、実行環境＆フレームワーク＆クラウドPaaS＆パッケージマネージャーといったところでしょうか。Node.jsとHerokuとnpmが一緒になったようなもんだと思えば、イメージがわくと思いますが、実態はそれらを上回っています（パッケージ数はnpmの比じゃありませんが・・・使い勝手という意味で）。 インストール ターミナルをたちあげて、以下のコマンドを実行するだけ。 （行頭の$はターミナルであることを表してるだけで、コマンドの一部じゃありません） $ curl install.meteor.com | sh これで /usr/
JavaScriptを書け - Write and Run
※今日はエイプリルフールではありませんが以下略 なぜ CoffeeScript がダメか - 冬通りに消え行く制服ガールは✖夢物語にリアルを求めない。 - subtech なぜ CoffeeScript がダメかって? そりゃ俺が CoffeeScript 使ってたら彼女にフラれちまったからさ。CoffeeScript を書く奴はモテない。それでも CoffeeScript を書くなとは言わねぇよ。でもな、JavaScript を書け。 JavaScript は自分の足を撃ちぬく JavaScriptはマジファッキンな言語だ。クソなところはいくらでもある。朝書き始めたら夜寝る頃には体中に弾丸の穴が空いているような、そんな言語だ。とにかく暴発する。this がどこを指してんのかわからんだとか、var 書き忘れてるだとか、=が一個足らないだとか。でもそんなことはデベロッパーの責任で、それこそ
JSもついに最初の言語として推奨できるようになったぞ！というBusterJSの紹介
自己紹介 ども。KAYACでJS書いてる@kyo_agoです 最近はスマホ環境で色々JS書いてます 今回はかなり内容に主観が入ってます
[JS]広大なカンバスを使って次々にコンテンツをスライドさせるスクリプト -jmpress.js
テーマ左上から、base、sunny、le-frog、ui-darkness 対応ブラウザは、下記の通りです。 iPadも対応というのはいいですね。 Chrome/Chromium Safari Firefox IE Opera iPad impress.jsからの移行 jmpress.jsは「impress.js」のjQuery版で、impress.jsの特徴全てと更に多くの機能を備えています。 impress.jsから移行するには、jquery.jsを加え、スクリプトをimpress.jsからjmress.jsにし、スクリプトの呼び出しを「$(selector).jmpress(); 」に変更します。 impressのデモをjmpress.jsで動かしたデモ jmpress.jsの使い方 HTML ルートとなるdiv要素に「id="jmpress"」をつけ、各コンテンツをdiv要素で配
HTML5/CSS3にも対応、HTML/CSS/JavaScriptを整形・チェックするオンラインツール -Dirty Markup
Dirty Markup [ad#ad-2] Dirty Markupはウェブ制作者がよく使う下記のツールをまとめたような感じです。 HTML Tidy CSS Tidy JS Beautify Dirty Markupの使い方は簡単で、右側にコードをペーストし、左側でHTML/CSS/JavaScriptを設定し「Clean」ボタンをクリックするだけです。
WebSocket で PNG 画像をバイナリ転送して、JavaScript で展開して表示してみた - hakobera's blog
Node.js で WebSocket-Node を使って実装しました。 転送するめぼしい画像が見当たらなかったので、デスクトップをスクリーンキャプチャして転送してみました。 ブラウザはChrome 17以上か、Firefox 11以上が必要です。サーバ側は scrrencapture コマンドを利用している関係で Mac OS X限定です。 デモ 上半分が転送元のデスクトップ、下半分が転送された画像をブラウザで表示したものです。ニコ動のコメントの飛び具合を見るとわかると思いますが、800*600の解像度の画像を、横640に縮小して転送して、1FPSくらいです。（※ これはWebSocket の限界ではありません。速度は向上させる余地はかなりありますが、今回の本質ではないので気にしないことにします） ソースは github に置いてあります。 hakobera/screencast · G
コーディングの効率化に効くと評判のツールを手軽に試せるサイト(+アドオン)4つ | バシャログ。
桜はまだか。hakoishiです。 さて、web制作界隈は次々に便利なツールが登場してきます。 「便利と評判のあのツール、使ってみたいけど導入が手間で…」 そんな時、web上で手軽に試せるツールがあったりすると嬉しいですね。 ってことで、今回はそういったツール達のご紹介です。 zen-codingを試す JavaScriptフレームワーク各種を試す LESSを試す vimを試す zen-codingを試す マークアップ効率化 - zen-codingでコーディングを倍速に (Yahoo! JAPAN Tech Blog) 「基本的な記法」まで移動して、各デモ欄の文末でtabを押してみてください。結構感動しますよね。 編集するとそれも反映されますので、いろいろ試してみてください！ 【参考】 物足りなくなったら、こちらも。 kzms2 zen-coding editor JavaScriptフ
ここまでやるか。SQLiteをJavaScriptに変換·SQL.js MOONGIFT
SQL.jsはSQLiteをEmscriptenを使ってJavaScript化したソフトウェアです。 SQL.jsはWebブラウザ上で使えるデータベースです。Emscriptenを使ってSQLiteをJavaScriptに変換した面白いソフトウェアです。 デモです。テキストエリアに書かれたSQLを実行できます。 実行した結果です。最終的な結果だけが出力されています。SELECTの結果はJSONデータとして取得されています。 もちろん普通にSQLが使えます。 日本語は出力時は化けてしまいましたがデータ上は問題ないと思われます。 SQL.jsはSQLiteがそのままJavaScriptになってしまったようなソフトウェアです。慣れた使い勝手でSQLを実行したり、データを取得できてしまうのは面白そうです。なお現状Google ChromeやFirefoxにしか最適化されていません。 SQL.jsは
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
https://jp.techcrunch.com/2012/04/12/20120411meteor-launch/
