Web SQL Databaseの導入
webサイト高速化とオフライン対応

澤 紀彦
Aug 21, 2011

サービスの紹介 - スマホ向けwebサイト

オフライン技術

オフライン対応で高速化!!

localStorageをやめた経緯

  • 初めはlocalStorageで作っていた
    記事ID1 {"見出し":"福島第...", "本文":"東京電力は...", "timestamp":1313845440}
    記事ID2 {"見出し":"企業、円高買収...", "本文":"一時初の1ドル...", "timestamp":1313846594}
  • localStorageに貯めた記事データは応用しにくい
    ページによって抽出条件を変えたり、古い記事はローカルから消したりしたい
  • Web SQL Databaseへの乗り換え

Web SQL Databaseとは

→でもGoogle, twitter, FTが使用中

他社の事例 Financial Times - app.ft.com

localStorageと比べたメリット・デメリット

メリット デメリット
ソートができる 構造を変えにくい
検索ができる 非同期処理なのでコードが長くなる
JOIN、サブクエリが使える テーブルを追加するほどでもないもの
window.localStorage.getItem('記事ID');
        
db.transaction(function(tx){
  tx.executeSql("select * from `記事テーブル` where `面` = '一面' order by `順番`"
    , [], function(tx, rs){
      for(var i=-1,l=rs.rows.length;++i<l;){
        console.dir(rs.rows.item(i)); //object
      }
  });
});

今回はハイブリット型を採用

使用に当たって気を付けたこと

ご質問はこちらまで