オレ標準JavaScript勉強会を開催しました

Twitterでこっそりと募集して、オレ標準JavaScript勉強会というイベントを開催しました。 id:edvakfさんが来日されるということで、「会いましょう→何かやりましょう→勉強会とかどうでしょう」というTwitter上の軽いノリで企画され、みんなで短いネタを披露…

SVG特集第2回・第3回

特集:スタートアップ SVG|gihyo.jp … 技術評論社の第2回と第3回が公開されています(第2回は1週間前ですが)。 ここまででIE9pp3やRaphaëlがサポートしている機能は一通り紹介しました。 次回で最終回なので、具体的な利用ケースとか、チップスとかを詰め込…

JavaScript連載第10回

これでできる! クロスブラウザJavaScript入門の第10回はJavaScriptとCSSです。 styleプロパティの操作に関するアレコレから、動的なルール操作やスタイルシート自体の追加方法など、JavaScriptからスタイルシートを扱う際のチップスを一通り詰め込んでみま…

ブラウザー勉強会でWebKitの拡張について話してきました

ブラウザー勉強会というのは、hebikuzureさん主催のウェブブラウザについての勉強会です。「ウェブブラウザについて」と一口にいっても割と範囲が広くて、特に今日の参加者を見ても、ウェブブラウザを実装してる人から、拡張を作ってる人、ウェブサイトを作…

SVGの特集記事

gihyo.jpにて、SVGについての全4回の集中連載を始めました。 特集:スタートアップ SVG|gihyo.jp … 技術評論社 第1回はSVGの基礎知識について。最初なのであまりSVG自体は出てこないですが、そもそもSVGってどうやって扱えばいいのかって話をメインに書きま…

JavaScript連載第9回

これでできる! クロスブラウザJavaScript入門の第9回は実践DOMスクリプティング#2:DOMとHTMLです。 本当は月曜更新なんですが、原稿が遅れて1日遅れの公開となってしまいました…。申し訳ありません。 さて今回は前回に引き続き、HTMLの操作系です。安全か…

連結リスト(LinkedList)のベンチマーク

LinkedListは一言で言えば数珠繋ぎになったデータです。定義的には色々種類がありますが、今回は配列の代わりに順番にデータにアクセスする方法として使用します。具体的にはこういうことです。 function linkloop(){ var n = first; do{ // n } while ((n =…

jsdo.itで遊ぼう!

既にご存知の方も多いと思いますが、1週間ほど前にKAYACさんの新サービスjsdo.itがリリースされています。 jsdo.itはHTML, CSS, JavaScriptを編集してその場で実行、共有するプログラマ向けコミュニティサイトです。wonderflをご存知の方はそのJavaScript版…

JavaScript連載第8回

これでできる! クロスブラウザJavaScript入門の第8回は実践DOMスクリプティング#1 HTMLとテキストの操作です。 今回は今までより少し掘り下げていて、最適化とかにも少し触れています。これぐらいのほうが面白みがあって良いのかなとも思う一方、「クロスブ…

NinjaKit for Safari

NinjaKitのSafari版が一応できました。 NinjaKit - 0xFFからどうぞ。 注意点などはChrome版と同じです。ただ、GM_registerMenuCommand未対応なのと、オプションページを呼び出す方法がツールバーのボタンしかありません。このあたり、Safari版は右クリックメ…

Safari用SocialCounter(とTextURLLinker)更新

SocialCounterとTextURLLinkerも自動更新対応しつつ、ツールバーはスペースを使いすぎるのでボタンにしてみました。ボタンには数値を表示する機能があるのでそれを使ってブックマーク数を表示します(ただ、デフォルトの見た目がちょっとクドイ感じでしかもス…

NinjaKit

NinjaKit*1というChrome/Safari拡張を公開しました。 Chrome:Chrome Web Store - NinjaKit Safari:NinjaKit for Safari Source: os0x/NinjaKit · GitHub これはFirefoxのアドオンであるGreasemonkey相当の機能を実装することを目指しています。 今のところ、…

Safari拡張の自動更新方法

次のようなXMLを拡張子.plistで適当な名前で保存して、サーバーにアップします。 <plist version="1.0"> <dict> <key>Extension Updates</key> <array> <dict> <key>CFBundleIdentifier</key> <string>net.…</string></dict></array></dict></plist>

Safari用AutoPatchWork更新

ツールバーのアイコンがイマイチだったので、ページ下部にラインを表示してみました。なんか見事にAutoPagerizeの更新と被っているのに気がついたんですが、ホント偶然です。 ページの一番下にしたのは動作を止めたい時というのは大抵フッターを見たい時だと…

ユーザースタイルシートでChrome風ステータス表示

CSS

Chrome風なステータスバー表示をするSafari拡張が何種類か出ているみたいですが(どれもText URL Linkerと相性が悪く…)、CSSだけで大体実現できそうだなと思い、試してみました(Text URL Linkerとの相性が良いので)。 このスタイルはサイトによって、リンクが…

Safari拡張の作り方

Safari拡張をいくつか作って大体感覚は掴めたので、ざっくりと拡張の作成手順を解説してみます。 なお、Windows版で作業していますが、Macでもほとんど同じだと思います。 Safari拡張とは 最初に、Safari拡張とはなにか、について。Safari拡張はHTML/CSS/Jav…

Safari5の拡張作ってみた

Chrome拡張をとりあえず3つだけSafari拡張に移植というか、どちらでも動くようにしてみました。以下からインストールできると思いますが、今のところ拡張は頻繁にクラッシュしますし、正式リリースされてないということは色々と問題が残っているということで…

JavaScript連載第7回

これでできる! クロスブラウザJavaScript入門の第7回はJavaScriptとHTMLとDOMの基本#2 イベント編です。リンク先が前回になってました。ごめんなさい。id:edvakfさんご指摘感謝。 今回はイベントです。あとレガシーな書き方にも触れています。レガシーなコ…

JavaScriptで3D

id:wanparkさんが(3年前に)書かれたchannel3というFlash用3DグラフィックライブラリをJavaScriptにポーティングしてみました。IEは未対応です(たぶんそのうち)。 channel3JS - ss-o.net この前のCanvasでDot3Dが結構余裕だったので、もうちょっと本格的な(だ…

oAutoPagerize ver1.5.2

Opera 10.6 (alpha) で oAutoPagerize を動かす - もし高校野球の女子マネージャーがOpera Browserを使ったら - チーム俺等の件と、Yahoo検索でフリーズしてたっぽい問題を修正、ヤフオクとかでも動くようになった、と思う。Google画像検索、英辞郎 on the W…

W3C Widget とその応用を考える会でLTしてきました

2010年5月27日開催 HTML5 TechTalkスペシャルにて、Canvasについてお話してきました。 発表に使ったスライド:Canvasでピクセル操作 by os0x デモはPixel Worksに(Opera Widgets用だけど普通のHTMLなので大抵のブラウザで動きます) 他の方の発表・資料はPast…

JavaScript連載第6回

これでできる! クロスブラウザJavaScript入門の第6回はJavaScriptとHTMLとDOMの基本#1です。 今回は正直に言ってかなり苦戦しました。。DOM周りは書くことがありすぎてなかなかまとめきれないし、その前にHTMLについて書いておきたいこともあってと。 scrip…

Chrome5の新機能とか、Chrome6について

Google Chromeについてはやや久しぶりに、gihyo.jpさんで記事を書きました。 ブラウザ:Google Chrome 5の新機能とChrome 6の計画|gihyo.jp … 技術評論社 そろそろChrome5がリリースされそうです、ということで、Chrome5がサポートする機能を開発者向けの情…

CSSセレクタの高速化の話を検証

CSSセレクタの高速化の話し - Webtech Walkerの件。元ネタは続・ハイパフォーマンスWebサイト ―ウェブ高速化のベストプラクティスで、元ネタの元ネタはWriting Efficient CSS for use in the Mozilla UI - MDC。 先に書いておくと、この元ネタのMozillaの記…

ブックマークレットサービス・Hatena::Let を使ってみた

ブックマークレットサービス・Hatena::Let を作りました - 2nd lifeとのことで、早速使ってみました。使い方はホント簡単でログインして作成ボタン押して書いたら公開するだけ(ブログに貼るには個別ページ下にあるiframeタグをそのまま使うだけ)。 とりあえ…

JSパーティクル崩し

canvasをバイト単位で修正する方法(ImageDataの使い方) | tech.kayac.com - KAYAC engineers' blogを少し改良してFirefox、Operaでも動くようにしてみた。 JSパーティクル崩し 修正点 Firefoxはcanvas外(幅100pxのcanvasにx:100.1とか)にputImageDataしよ…

2つのChromeを共存させる方法(Google Chrome SxS)

複数のバージョンのGoogle Chromeを同時に動かす方法 - 0xFFでは、かなり強引にスタンドアローンなChromeを作る方法を紹介しましたが、最近(Issue 35574 - chromium - Add side by side distribution - An open-source browser project to help move the web…

JavaScript連載第5回

これでできる! クロスブラウザJavaScript入門も早くも第5回で、今回はJavaScriptの基礎知識#2:クロージャ編です。 結構時間をかけた甲斐があって、かなりわかりやすくなったんじゃないかと自画自賛してるんですがいかがでしょうか? 今回もあんまりクロス…

IEでpassword表示

IE

140文字以内でパスワード丸見え - latest log IE対応は結構面倒なんですよね。 まず、IEはinput要素のtypeを書き換えさせてくれないので次のようなスクリプトすら通らない。 var d=document.createElement('div'); d.innerHTML='<form name="f"><input type="text" name="t"></form>'; document.body.appendChil…

JavaScript連載第4回

これでできる! クロスブラウザJavaScript入門 第4回 JavaScriptの基礎知識#1 今回は少し基本に戻ったお話です。いや基本といえば基本だけど、わかりにくい・間違いやすいだろうなというところにスポットを当ててます。 この連載で意識しているのは、「JavaS…

BPStudy#32でChrome拡張とECMAScript5についてお話してきました

若手IT勉強会 : ATND(次回25日)繋がりのid:monjudohに誘われて株式会社ビープラウドさん主催のBPStudy#32 : ATNDでChrome拡張についてお話してきました。 資料はこちらChrome Extension with ECMAScriptまたこの資料か、という声が聞こえてきそうですが、htt…

第3回はクロスブラウザの傾向と対策

これでできる! クロスブラウザJavaScript入門:第3回 クロスブラウザの傾向と対策|gihyo.jp … 技術評論社 と、今さらですが、連載全体としては連載:これでできる! クロスブラウザJavaScript入門|gihyo.jp … 技術評論社からどうぞ。今回からいよいよクロ…

「続・ハイパフォーマンスWebサイト」レビュー

Chrome Extensions TechTalkの日に、Googleの及川さんから「続・ハイパフォーマンスWebサイト」を頂きました。 続・ハイパフォーマンスWebサイト ―ウェブ高速化のベストプラクティス作者: Steve Souders,武舎広幸,福地太郎,武舎るみ出版社/メーカー: オライ…

Chrome Extensions TechTalk#1

2010/4/9にChrome Extensions TechTalkを行いました。おかげさまで、80名近い方に出席頂きました。ありがとうございます。 正直、私の力不足で進行やらがグデグデでした。すみません。でも、及川さん、田村さん、白石さんの素晴らしい発表と、ライトニングト…

ブラウザの環境構築のまとめを書きました

これでできる! クロスブラウザJavaScript入門:第2回 完全版:ブラウザとデバッグ環境|gihyo.jp … 技術評論社IE6,7,8をどうやって共存させるのかとか、Firefox・Safari・Chrome・Operaの旧バージョンはどこから落とせるのとか、各ブラウザでデバッグするに…

HTML5とか勉強会でお話してきました

HTML5-Developers-jpの白石さん主催の第4回 HTML5とか勉強会(旧Webkit/HTML5勉強会) : ATNDでChrome拡張についてお話してきました。 資料はこちら Chrome Extension meets HTML5 第4回 HTML5とか勉強会(チロルは除く) - Togetterに、Ustreamの録画もあり…

クロスブラウザJavaScriptの連載始めました

これでできる! クロスブラウザJavaScript入門:第1回 ウェブブラウザとJavaScriptの未来|gihyo.jp … 技術評論社 gihyo.jpさんでクロスブラウザを扱った連載を始めました。JavaScriptを中心に、CSSなどの周辺の話や、その辺のバックグラウンドにある標準化…

oAutoPagerize ver1.5.1 RC1

Opera10.50 RCが出ましたが、「oAutoPagerizeが原因でフリーズするぞ、どうなってんだ」とのご指摘を頂きましたので、oAutoPagerizeもRC版をリリースしました。 というのも、Googleとか(いろんなサイトで)で落ちるって報告だったんですが、こちらではGoogle…

Google DevFest 2010とクイズについて

Google Japan Blog: DevFest 2010 Japan を開催します Google Japan Blog: クイズに答えて DevFest に参加しよう DevFest 2010 Japan 私はChrome拡張について直接発表はしませんが(Googleのエバンジェリストのブライアン・ケニス氏が発表されます。同時通訳…

続・先取り! Google Chrome Extensions最終回

続・先取り! Google Chrome Extensions:第10回 Chrome拡張の国際化とギャラリーへの公開と総まとめ|gihyo.jp … 技術評論社 はい、というわけで、連載終了となりました。連載中何度か取り上げていたSBMカウンタを国際化してギャラリーに公開して終了と、我…

Google Chrome用ユーザースタイルシート拡張

Chrome Web Store - Stylistのver2.0を公開しました。元々、ハッカソンの時に作った拡張で、長いこと中途半端な実装状態のままギャラリーに公開していたんですが、ようやくそれなりに形になりました*1。 元々Chromeはuser.jsを拡張に変換してインストールす…

ChromiumでVertical Tabsの試験的な実装が始まっている

少し前から、ChromiumOSのUIモックにSidetabバージョンがあったのですが、この実装が始まりました。 Issue 34509 - chromium - Vertical Tabs - An open-source browser project to help move the web forward. - Google Project Hosting ちょうど今日、 Iss…

最後のタブを閉じる時にChromeがなるべく終了しないようにする拡張を作った、他2本

なるべく、と付いているのは、タブをセンタークリック(マウスホイールでのクリック)すると終了してしまうからです。Ctrl+wや、タブのバツボタンや、GestureやKeyconfigでの閉じるアクションなら、ホームページだけの新しいウィンドウを表示します。 Prevent …

oAutoPagerize ver1.5.0

Google画像検索で動かなくなっていたのを修正。 ついでにFirefox3.6でも動くように。Firefoxで使っている人はいないかもしれないけど、Bookmarkletとしても使えるので一応。 あと繰り返しになるけど、Google Chrome4ではoAutoPagerizeは動かないので、Chrome…

referrerやDeferredのスペル

JSDeferredを打とうとしてrとeの数に不安になるこの頃だったが、 refer + rer defer + red で憶えると間違えないことに気がついた。

Chromeで読み込みに失敗した画像についてリファラを消して再読み込みを試みる方法

[追記]実際に使用したい方は @civic さん作のLDR Image Loader extensionをどうぞ。Chrome Dirty Hacks 01: fc2 image for LDR - 枕を欹てて聴くの別解みたいなのです。要は、livedoor Readerでfc2やアメブロの画像を表示してやろうというネタです。まず、id…

HTML5やECMAScript5の話

HTML5周辺やECMAScript5の話をgihyo.jpでいくつか書かせて頂きました(上2つは3週、2週前の記事ですが…)。 新春特別企画:2010年のJavaScript:「これまで」と「これから」|gihyo.jp … 技術評論社 続・先取り! Google Chrome Extensions:第7回 Google Chro…

Chromeをスタンドアローン化した際に起動できないバグへの対処

複数のバージョンのGoogle Chromeを同時に動かす方法 - 0xFFの方法で http://dl.google.com/chrome/install/249.78/chrome_installer.exe (stable版Chrome4) をスタンドアローン化して起動しようとしたら必ずクラッシュして起動できない現象が発生。debug.lo…

ECMAScript 5 and Chromium/V8

Page not found | Qt Blogの補足とV8版です。赤くなってるのはChrome5で使えるやつです。 Object.getPrototypeOf WebKit https://bugs.webkit.org/show_bug.cgi?id=28114 Chrome http://codereview.chromium.org/518056 Object.getOwnPropertyDescriptor Web…

2009年12月あたりのこと

今月は思ったより忙しかったです。API Expertの件とgihyoでの連載+αがやはり大きい。拡張開発のほうも今ひとつ進んでいないです、主にStylistのインターフェースで躓いています…。 とはいいつつ、ゲームはちょこちょこやってて、ペルソナ3ポータブルはもうち…