Hatena::Groupptech

ぷちてく RSSフィード

Archive
 
ProfileProfile

2015-04-20

Re:画像のlazyloadとページ継ぎ足し

09:16

コメントにするには長いので返信兼ねて少し事情書きます。この辺りです。

ユーザースクリプトブックマークレットAutopagerize系と画像のlazyload周りの話。

経緯

lazyloadされる画像をimmediately(即時)に描画するアイデアは、元々toさんという方がUserScriptで書かれたものです。

これはGIGAZINEjQuery.lazyload を即時描画する作りになってます。これが原点なのでこのコンテキストだと「考案」されたのはtoさんです。

これをまずぼくがforkして大幅にコード足しました。一旦手を入れ終わったリビジョンへのリンクになってます。

この時点では jQuery.lazyload を 任意のサイトで切る機能のまま変化してません。 g-lii.user.jsgGIGAZINEからGloballyに変わっただけです。

その後ぼくの変更品をyuta25 さんがforkしてパフォーマンスと汎用性上げてくれました。現時点のリビジョンです。

こんな経緯なんですが、こうやって書くのはツラいので、大抵の方はGistに置いて上部の「forked from」とか「Forks」→「View Fork」や「Revisions」辿るという方式を取ってます。ぼくはなるべく1次まで追ってくようにしてます。

あとぼくの場合は、@contributor というScriptish由来のMetadataブロックを書いてるので、フォークツリーわかるのとリンクですぐ飛べるようにしてます。

課題

まずGistのUserScriptですが、まだ色々問題があるので直したいけどぼくがサボってるのと宗教上の理由、という感じです。これです。

f:id:noromanba:20150421075530p:image

Git断捨離 - Hatena::Counting

Gistで@contributor方式は同じ方がfork後何回も貢献してくれた場合破綻するので、本来は都度fetch-merge/pullしたい。が、git無いと出来ない。という感じです。他のUserScriptもこういう事態になってるので良くないですが、修行なので仕方ない。

まぁあまりにもアホなのでそのうちどうにかします。

コードの問題としてはバグってないけどもっとスマートに出来るという感じですが、さすがにこの辺は、

if (typeof (ctx.querySelectorAll) !== "undefined") {
//...
}

この方がいいんじゃないでしょうか。

if (ctx.querySelectorAll) { // alt. document.ELEMENT_NODE
//...
}

ただ、全体の構造自体があまり良くないと思ってます。

これらを書いた時点ではぼくがMutationObserverと併用するノードフィルタリングの扱いにこなれてなかったという背景があります。多分yuta25さんも。

未来

今はMutation eventsは積極的に使う利点がどこにもなく、throttledebounceを使う苦行を伴うので、もはやAutoPagerize_DOMNodeInsertedを使うのも古いという感じです。

この手の話2008年位で止まってて全然出てこないので前から書く予定です。そのうちエントリあげますが、Hatena::Letで主にぼくとyuta25さんがモダンっぽい手法を多用してるので繋ぎに見ると良いかも知れません。

特にyuta25さんはXHRで様々なサイトの自動継ぎ足しに長けているので参考になると思います。

後はぼくのGistに似たようなUserScriptが大量にあります。

便利

ちょっと継ぎ足し時に処理したいけど面倒くさい、という人のために、Forkして処理少し書いて完了するやつ作ってあるので使うと楽です。

http://let.hatelabo.jp/noromanba/let/hLHWuMHftq16

これもちょっとかっこ悪いので直したい。

長い。

トラックバック - http://ptech.g.hatena.ne.jp/noromanba/20150420

Copylight (c) noromanba 2012-2017