べにやまぶろぐ

技術寄りの話を書くつもり

Colored Hashtag for Trello を v1.0.3 に更新しました

こちらの Chrome 拡張ですが、

jQuery のセレクタで無駄に引き直しているところがあったのでそこを修正しました。また、Plus for Trello 拡張を意識して、複数のハッシュタグがある場合に先頭のものを使用するようにしました。

詳しくはこちらの GitHub で。

セレクタの性能改善については、一回 .list-card-title で個々のカードを引きにいった後、そこで取得した shortID でもう一回 .list-card-details で色塗りする親をセレクタで引いていたのが性能劣化を起こしていたので parent() で済ませるようにしました。

実行速度的には timer1 をセレクタで引き直すもの、timer2 を parent() で引くものとしたとき

coloredhashtag.js:95 timer1: 15.673ms
coloredhashtag.js:101 timer2: 0.042ms
coloredhashtag.js:89 ----
coloredhashtag.js:95 timer1: 14.759ms
coloredhashtag.js:101 timer2: 0.028ms
coloredhashtag.js:89 ----
coloredhashtag.js:95 timer1: 17.747ms
coloredhashtag.js:101 timer2: 0.027ms
coloredhashtag.js:89 ----
coloredhashtag.js:95 timer1: 13.844ms
coloredhashtag.js:101 timer2: 0.028ms
coloredhashtag.js:89 ----
coloredhashtag.js:95 timer1: 12.155ms
coloredhashtag.js:101 timer2: 0.029ms
coloredhashtag.js:89 ----
coloredhashtag.js:95 timer1: 13.309ms
coloredhashtag.js:101 timer2: 0.028ms
coloredhashtag.js:89 ----
coloredhashtag.js:95 timer1: 12.999ms
coloredhashtag.js:101 timer2: 0.027ms

という感じでカード一つの処理あたり 10 - 20 ms 程度の性能改善が見込まれます。今回実行速度も測ってみて、クラス名で引きにいくのはコストかかる処理だということを再認識しました。