タグ

ブックマーク / os0x.hatenablog.com (24)

  • git初心者向けのTipsなど - os0x.blog

    gitの基的なcommandしか使ってないって人向けのtips集です。 エイリアスの設定 $ git config --global alias.co "checkout" とすると、 ~/.gitconfig に [alias] co = checkout のように追記されます。 このようにgit configを叩いてもいいですし、~/.gitconfigを直接編集しても大丈夫です。 とりあえず、 [alias] co = checkout # checkout長い… st = status -sb # シンプルなstatus pr = pull --rebase # pull するときにmergeコミットを作らない fo = fetch origin ro = rebase origin # branchでfoしてroすればmasterにrebaseできる rc = rebase -

    git初心者向けのTipsなど - os0x.blog
    YAA
    YAA 2013/10/09
  • 君は3つのリロードを知っているか? - os0x.blog

    はい、今さら聞けないウェブ開発者の基礎知識のお時間です。 ブラウザには3つの読み込みモードがあることはご存知ですか? 2つくらいはわかるけど、3つ目が出てこないって方は少なくないかもしれません。 リロード 一番オーソドックスなのがブラウザのリロードボタンを押したときの挙動ですね。普通ですね。 スーパーリロード ブラウザによっては、スーパーリロードという機能を備えています。IEの場合Ctrl+F5(Ctrl+更新ボタン)、Firefoxの場合Ctrl+F5(Shift+更新ボタン)、Chromeの場合Shift+更新ボタン(Ctrl+Shift+R)などでスーパーリロードを呼び出すことができます。スーパーですね。 ページ遷移(リフレッシュ) 3つ目はちょっと良い名前が思いつかないのですが、リロードではなく、通常の画面遷移での読み込みのことです。アドレスバーにフォーカスしてenterするといっ

    君は3つのリロードを知っているか? - os0x.blog
    YAA
    YAA 2011/07/05
  • JavaScriptのデバッグTips - os0x.blog

    JavaScript Advent Calendar 2010 8日目担当のid:os0xです。 JavaScriptネタは案外範囲が広くて色んなネタがあるので、毎回が楽しみですね。 さて、私はデバッグをネタにしたいと思います。テストではなくデバッグです。誰かが書いたコードをメンテナンスしなきゃー、とか。jQueryプラグイン導入しようとしたけど、なんかうまく動かないーみたいなケースのおはなしです。 JavaScriptのデバッグは大変なので、多くの方が日々苦労されていると思います。なぜJavaScriptのデバッグが大変なのか少し整理してみましょう。 ブラウザ依存 まず、なんといってもJavaScriptはウェブブラウザ上で実行されるので、環境が一定ではありません。特定の環境だけを対象にJavaScriptを書くことは滅多にありません。PC向けではIE、Firefox、Chrome、Sa

    JavaScriptのデバッグTips - os0x.blog
  • AutoPatchWork更新とSITEINFOのあれこれ - os0x.blog

    まだChrome版だけですが、AutoPatchWorkを更新しました(AutoPagerizeのセキュリティアップデートとは関係ありません)。 Chrome Web Store - AutoPatchWork ローカライズして(一部を日語で表示されるようにしただけですが)、かなり前に作りかけていたSITEINFOの管理機能を載せました(あと、NAVERまとめとTumblrの専用対策)。 こんな感じです。 主な機能は 検索 ソート 特定のSITEINFOの無効化 SITEINFOの編集 "number of successful"はURLがマッチして実際に使われた回数、"number of failed"はURLがマッチしたけどXPathでマッチしなかった回数です。自分がよく使うSITEINFO、まったく使ってないSITEINFOが確認できます。 統計を取り始めたのは今年の2月くらいのア

    AutoPatchWork更新とSITEINFOのあれこれ - os0x.blog
  • オレ標準JavaScript勉強会を開催しました - os0x.blog

    Twitterでこっそりと募集して、オレ標準JavaScript勉強会というイベントを開催しました。 id:edvakfさんが来日されるということで、「会いましょう→何かやりましょう→勉強会とかどうでしょう」というTwitter上の軽いノリで企画され、みんなで短いネタを披露し合う一品持ち寄りの少人数勉強会をやってみよう、ということになりました。で、そのままTwitter上で参加者を呼びかけてみたところ、半日もたたずに15名集まって、しかもそうそうたる顔ぶれに! 当日 色々と反省があったので、少し書き出しておきます。 まず、会場*1には有線LANしかないので、自前のルータで無線LANをやろうとしたんですが、設定がなかなかうまくいかず、だいぶ手間取ってしまいました。やはり、安物のLANは駄目ですね…。大人数で繋ぐと安定しないし、有線をいっぱい用意したほうが良かったです。 で、Ustreamに挑

    オレ標準JavaScript勉強会を開催しました - os0x.blog
  • AutoPagerizeを軽量化するアイデア - 0xFF

    先に結論を言うと、AutoPagerizeは拡張版がオススメです。以下その理由と余談的なお話です。 拡張版のAutoPagerizeについてちょっと勘違いしてました。AutoPagerizeは軽量化できるという話に路線変更します。 AutoPagerizeってのは、次のページを今見ているページの下に継ぎ足して、ページ遷移することなく次のページを見ることができる、ブラウザの機能を拡張するスクリプトです。 このAutoPagerizeは派生スクリプトがたくさんあって、FirefoxだけでみてもGreasemonkey版のAutoPagerize(家)、cho45さんのjAutoPagerize、Add-onのAutoPagerize(家)、AutoPager(作者は日人ではなく、どちらかというと非日語圏向けかも)などなど。他にもかなりの数があります*1。 で、Opera、Google

    AutoPagerizeを軽量化するアイデア - 0xFF
  • 毎秒100回JavaScriptが実行ってのがどの程度なのか - os0x.blog

    非ネットで聞いた話なども含め、ここまでやっても信じない人もいっぱいいるみたいで、そこまで疑う人のためにとりあえずパッチは出しておいたのだが、みんな「怪しいよね」って陰で言うだけで、誰も追試はしてくれなかったみたいだ。他人の書いた、しかもCPU使用率なんて割とどうでもいい系のエントリなんてわざわざ検証する人はそりゃいないだろうとは思うけど、気分が悪いのも確かだ。どうせ誰も試さないなら、パッチ自体は次のネタにとっときゃよかったなぁ…。 http://d.hatena.ne.jp/tkng/20091003/1254578195 では折角なので、検証を。Firefox前提なら、Firebugのプロファイル機能で一発なので、検証用マシン*1で以下のスクリプト実行。 // ==UserScript== // @name google stats // @namespace http://ss-o.n

    毎秒100回JavaScriptが実行ってのがどの程度なのか - os0x.blog
  • JavaScriptの勉強会資料を公開 - os0x.blog

    私が講師役をしている社内向けJavaScript勉強会の資料をまとめて公開しました。 実践JavaScript - 株式会社ALBERT 社内勉強会資料 1回目を書いてからだいぶ間が空いてしまいましたが、その分6回分をまとめて、インデックスや見た目等々を整理してあります。 コードのハイライトには google-code-prettify - syntax highlighting of code snippets in a web page - Google Project Hosting を使用してみたのですが、すごく重かったので出力結果を静的に使っています。 オススメ回は実践JavaScript - JavaScript特有の問題・クロスブラウザなど - 株式会社ALBERT 勉強会資料でしょうか。特にクロスブラウザなDOMサイズ取得は自分でも良く参照してます。 間違いなどありましたら

    JavaScriptの勉強会資料を公開 - os0x.blog
  • AutoPagerizeで継ぎ足された部分に自分のスクリプトを適用する方法あれこれ - os0x.blog

    以前からある手法から順番に見ていきます。 ページの高さの監視 setIntervalでページの高さを監視して、増えていたらAutoPagerizeが動いたとみなして処理を行う var THRESHOLD = 300; var _height = window.innerHeight; setInterval(function(){ if (window.innerHeight - _height > THRESHOLD) { // 処理 } _height = window.innerHeight; }, 300); メリット AutoPagerizeだけでなく、はてなダイアリー・ブックマーク、Twitterなどでのサイト側でのページの継ぎ足しにも対応できる デメリット THRESHOLDをいくつにするかなど、一概に決められない。タイマーをたくさん回すと重くなる。Floatしている要素を継

    AutoPagerizeで継ぎ足された部分に自分のスクリプトを適用する方法あれこれ - os0x.blog
  • FirefoxとOpera対応のUser Scriptを書くときのunsafeWindow - os0x.blog

    煤 - Note : 各ユーザスクリプトツールの window、unsafeWindowの件。 今までは、 var w = typeof unsafeWindow != "undefined" ? unsafeWindow : window; こう書いてた。typeofや"undefined"が嫌な感じ。 でも、 var w = this.unsafeWindow || window; これでいけるみたい。 もちろん、thisが変わっている場合は使えない。 無名関数を使って、 (function(unsafeWindow){ // alert(unsafeWindow) })(this.unsafeWindow || window); こうするとスマートかも。 SafariやIE(fub)は確認してない。(が、問題ないと思う) [追記] miya2000さんのブクマコメより、 window

    FirefoxとOpera対応のUser Scriptを書くときのunsafeWindow - os0x.blog
  • AutoPagerizeの動作の流れ - os0x.blog

    AutoPagerize くらいは - twwp宛て。 家swdyh版について(oAutoPagerizeも主な流れは同じだけど)、ざっくりと処理の流れを(細かいところやメインでない部分は省いています)。 ページの読み込み→Greasemonkey起動(この辺は省略)、AutoPagerize起動 SITEINFOの読み込み SITEINFOの期限が切れていた場合、wedataから最新を取得 URLにマッチするSITEINFOがあるかチェック、なければ終了 SITEINFOのXPathが機能しているかチェック、XPathで要素を取れなかったら終了 初期化処理 次のページのURL取得 差込位置の決定、insertBeforeか、pageElementの最後の次の要素 右上アイコン・ヘルプの設置 スクロール監視の開始 読み込み開始位置の決定(どこまでスクロールしたら次のページを読み込むかは、

    AutoPagerizeの動作の流れ - os0x.blog
  • XMLHttpRequest Level 2 と wedata バックアップ - os0x.blog

    http://ss-o.net/json/ 以下に対して、.htaccessで Header append Access-Control-Allow-Origin: *という指定をして、ヘッダーにAccess-Control-Allow-Originをつけているので、(*はすべてのドメインからのリクエストを許可) http://ss-o.net/json/wedataAutoPagerize.json http://ss-o.net/json/wedataLDRize.json などのファイルについてはFirefox3.5、Safari4、Google Chrome 2、IE8*1などのブラウザではクロスドメインでXMLHttpRequestを投げることができます。 サンプルコード javascript:(function(){ var xhr=window.XDomainRequest?

    XMLHttpRequest Level 2 と wedata バックアップ - os0x.blog
  • Event Driven JavaScript - os0x.blog

    document.createEventとdispatchEvent、addEventListenerを使ってイベントドリブンに書いたJavaScriptがオレブーム(ただし、IE非対応*1 )なので、軽く紹介してみたいと思います。 具体的には、AutoPatchWork (Google Chrome Dev用のextension)をイベントドリブンで実装しています。 AutoPatchWork.jsが2009/06/11 21:00時点のソース(id:nanto_viのコメントをうけて#を.に変更済み)。シンプルさを重視しているので、324行と短めです(CSSは別ファイルですが)。 window.addEventListener('scroll', check_scroll, false); window.addEventListener('AutoPatchWork.request',

    Event Driven JavaScript - os0x.blog
  • Google Chrome 2.0のUserScriptsはGreasemonkey互換のようで、そうではない - os0x.blog

    嵌る人がいそうなので、先に書いておきます。 User Scriptsを書いてみると GM_系のAPIが一通り定義されていて、一見Greasemonkeyと互換性がありそうに見えますが実はほとんど機能していません。 実装は http://src.chromium.org/viewvc/chrome/trunk/src/chrome/renderer/resources/greasemonkey_api.js?view=log にあるんですが、例えば GM_[gs]etValueはlocalStorageを使っていて、(これはChrome 3.0 で実装される予定、つまり未実装なので)使うとエラーになります。 そのほかも、中身は throw new Error("not implemented."); となっていて、使うとエラーをぶん投げてきます(typeofとかでチェックしても使えるかわから

    Google Chrome 2.0のUserScriptsはGreasemonkey互換のようで、そうではない - os0x.blog
  • 大量に同じ画像を表示したいとき - os0x.blog

    画像周りの速度メモ - #生存戦略 、それは - subtechの件。 最終手段として、CSSを使う。 .hatenastar{ display:inline-block; width:11px; height:10px; background:url('http://s.hatena.ne.jp/images/star.gif'); } (function(){ var now = new Date*1; for (var i = 0; i < count; i++) { var span = document.createElement('span'); span.className = 'hatenastar'; container.appendChild(span); } document.title += ' css:' + ((new Date*1) - now); })();

    大量に同じ画像を表示したいとき - os0x.blog
  • JavaScriptによるブラウザ判別の実際 - os0x.blog

    1 行でブラウザ判別を行うスクリプト (IE 用の日語紹介記事、Firefox、Safari 用の日語紹介記事) を発端に、SpiderMonkey の判別とブラウザ判別: Days on the Moon や JavaScript でのブラウザ判別 - 「仕様の盲点」ではなく、「プロパティの有無」を使う方がマシ - 2009年2月 - Blog - EOFなどの記事があがっています。 ここでは少し実際的なケースごとにサンプルコードを紹介していきたいと思います。(サンプルコードは適当に書いているので、不正確な箇所があるかもしれません。ご了承ください。間違い等ご指摘いただけると助かります。) なお、これらは汎用的なJavaScriptライブラリを使っていれば意識しなくても良いケースがほとんどです。 分岐する必要がないケース 分岐する必要がないなら、ケースとしてあげる必要はないと思われるか

    JavaScriptによるブラウザ判別の実際 - os0x.blog
  • Bug 442333 - Remove eval's optional second argument - os0x.blog

    442333 – Remove eval's optional second argumentの件。 peter.michaux.ca - Module Pattern Provides No Privacy...at least not in JavaScript(TM)によるとFirefox3.1でevalの第2引数は削除されるって話だったけど、http://d.hatena.ne.jp/nokturnalmortum/20080925#1222336042 によると3.0.2で既に動かないらしい。 これで動かなくなる Add-ons や Greasemonkey Script はそこそこありそうです。 # Bugzillaの見方がいまひとつ。。mozilla1.9.1a1 ってのはJavaScript1.9のことなのかな? だとしたら Function.prototype.bind

    Bug 442333 - Remove eval's optional second argument - os0x.blog
    YAA
    YAA 2008/09/29
    もともとなくなる方向だったのか。
  • 外部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
  • JavaScriptをこれから勉強しようと思っている人へ(jQueryよりprototype.jsを薦める理由) - os0x.blog

    JavaScriptは手軽で、実用的なプログラミング言語 どのくらい手軽かといえばJavaScriptを始めるのに(HTMLCSSは出来た方が良いけど)予備知識はほとんど必要なくて、ブラウザとエディタさえあればすぐにJavaScriptを動かすことができる(FirefoxにFirebugを入れればコンソールでその場実行できるのでエディタも(リロードも)不要)。 その上実用性も十分で、最近のウェブサービスのバックエンドはPerlPHPJavaRubyPythonなどなど様々だけど、フロントエンドは必ずといっていいほどJavaScriptが使われている(FlashもあるけどフルFlashサイトでない限りJavaScriptも使われているし、そもそもFlashを表示するのにJavaScriptが使われていたり)。とにかくJavaScriptが必要とされる場面はすごく多い。 と、こんな理

    JavaScriptをこれから勉強しようと思っている人へ(jQueryよりprototype.jsを薦める理由) - os0x.blog
    YAA
    YAA 2008/05/20
    jQueryは読んだことないから相対的にどうかは知らないけど、prototype.js もコメントなしにかなりアレな記述が突然でてくる気がする。でも Kanasan.JS で prototype.js を選んだのはかなり正解だった
  • Firefox3beta5のGreasemonkeyでGM_xmlhttpRequest使うときにBASIC認証ダイアログが出ない件の回避方法 - os0x.blog

    Firefox 3が落ちまくるので常用するのやめた - むぅもぉ.jp 落ちるのはFirebugがらみだと思う。特にgoogle adsとの相性が。でもfirebug-1.2.0a18Xが結構いい感じという噂。 で、題のGM_xmlhttpRequestを使うとBasic認証のダイアログが出ない問題。 Twit Fav commandでも同様の問題があって、やっつけで対応した方法のメモ。 問題:BASIC認証ダイアログが出ない TwitterにPOSTしたり、favしたりするにはBASIC認証で認証しないといけないんだけど、その認証ダイアログがFirefox3のGreasemonkeyでGM_xmlhttpRequestを使ったときには出現しない。で、onloadにはstatusコード401が返ってくる。 回避策:status401が返ってきたら、iframeで認証ダイアログを強制的に呼

    Firefox3beta5のGreasemonkeyでGM_xmlhttpRequest使うときにBASIC認証ダイアログが出ない件の回避方法 - os0x.blog