Technologies for UI

The liked article (presentation) is a bit old (written in 2006), but the concept seems to be still usable. The author is UI developer of Livedoor Reader which is the most famous online RSS reader in Japan.

He defines ‘right UI’ is

When a user deal with tasks, he/she can complete tasks

  • quickly
  • straight
  • correctly

on the UI.

To put it simply, ‘speed’ is the most important.

Since rendering and other process in browser take more time than transfer time, client side tuning effects significant. Summary of the techniques are:

  1. Use client side caching
  2. Divide complicated process and use callback function
  3. Use DOM (appendChild/insertBefore) for adding/insert contents
  4. Use innerHTML significant rewriting
  5. Display minimum data fast, then process next

Other points:

  • It’s good to allow user to cancel and restart the process even though it’s slow.
  • Web application should return minimum required data as quick as possible.

And the document mentioned server side tuning as well (e.g. reducing number of access to DB, server side caching, logging. etc.)

Other references for performance: Performance » Yahoo! User Interface Blog

Advertisements
Technologies for UI

A self-management checklist

There are 12 items in a checklist of self-management. (I’ve added Japanese translation below.)

  1. Set specific goals. / 具体的な目標を設定する。
  2. Set specific times. / 明確な時間を設定する。
  3. Track your progress. / 進捗を記録する。
  4. Set rewards or penalties. / 褒美、または罰を設ける。
  5. Take small steps. / 小さな一歩を踏み出す。
  6. Break it down into pieces. / タスクを細かくする。
  7. Monitor time increments. / 時間を測る。
  8. Share your goals. / 目標を共有する。
  9. Have a work buddy. / 一緒に歩む仲間を見つける。
  10. Review with your buddy. / 仲間とレビューする。
  11. Eliminate distractions. / 気を散らされるようなものを排除する。
  12. Review and rework your system. / やり方をレビューし、改善する。

I think the list could be organized in PDCA cycle

  1. Plan
    • Set following items:
      • Specific goals (and break it down into pieces.)
      • Specific times
      • Rewards or penalties
    • Have a work buddy.
    • Share your goals.
  2. Do
    • Take small steps.
    • Track your progress.
    • Monitor time increments.
  3. Check
    • Review with your buddy.
  4. Action
    • Review and rework your system.
    • Eliminate distractions.
A self-management checklist

Performance tuning of your SQL

There are 15 tips to improve the performance of your query.

SQLを速くするぞ―お手軽パフォーマンス・チューニング

  1. Use EXISTS instead of IN when you use subquery as an argument.
  2. BETWEEN is useful
  3. In the argument list of IN statement, write the most expected key in left
  4. Use ‘SELECT *’ in subquery of EXSISTS
  5. Write redundunt condition when you join more than 3 tables.
  6. Use COUNT(columname) instead of COUNT(*)
  7. Write the condition which get less results first in WHERE clause.
  8. Use UNION ALL instead of UNION.
  9. Make sure that the query uses index.
  10. ROWID pointer is the firstest access.
  11. Don’t use wildcard.
  12. Don’t use column index.
  13. Use alias name for table.
  14. Avoid implicit cast.
  15. Don’t abuse ‘view.’

According to the page’s author, these are based on the tips in Joe Celko’s SQL for Smarties: Advanced SQL Programming

Performance tuning of your SQL

Flockをインストール

TechCrunchで FireFoxのメモリに関する記事 を読んで興味を持ったので、しばらく Flock を使ってみようと思ってセットアップした。Flock は FireFox の Add-on を使えるので、それほど違和感なく使えると思う。

インストール

インストールは他のソフトウェアと同じ。Windows, Mac OSX, Linux 版が用意されている。

設定

デフォルトではスマートキーワードの設定ができないので、ロケーションバーから about:config を開いて、 flock.favorites.showKeyword を true にする。

ブックマークとスマートキーワード

検索なんかはいつも Ctrl + L (Windows) か ⌘ (コマンド) + L (OSX)でロケーションバーから行うので、スマートキーワードを次のように設定した。

名前 キーワード URL
Google google http://www.google.co.jp/
Google Search g http://www.google.co.jp/search?q=%s&ie=UTF-8&oe=UTF-8
I’m Feeling Lucky go http://www.google.co.jp/search?q=%s&hl=ja&lr=&btnI=I%27m+Feeling+Lucky
Gmail gmail http://mail.google.com/mail/
Google Reader gread http://www.google.com/reader/
Google Bookmarks gbook http://www.google.com/bookmarks/
Google Docs gdocs http://docs.google.com/
Google Notebook gnote http://www.google.com/notebook/

 
 

アドオン

インストールしたアドオンは次の通り。

Greasemonkey スクリプトはこれを入れた。

ちなみに autopagerize は Safari でも使える。

    1. SIMBL をインストール
    2. GreaseKit を /Library/ApplikcationSupport/SIMBL/Plugins/ にコピー (管理者権限が必要)
    3. oAutoPagerize をインストール

 

Flockをインストール