58
AlaSQL SQL библиотека для обработки данных на JavaScript Андрей Гершун [email protected] FrontEnd 2015

AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

  • Upload
    buibao

  • View
    262

  • Download
    5

Embed Size (px)

Citation preview

Page 1: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

AlaSQLSQL  библиотека  

для  обработки  данных  на  JavaScriptАндрей  Гершун

[email protected]

FrontEnd 2015

Page 2: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

AlaSQL

• Зачем?• Как установить?• Как  использовать?• ETL• Хранение  данных• Дополнительные  возможности

• Внутренности

2

Page 3: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Предыстория:Зачем  SQL  на  клиенте?

3

Page 4: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Зачем SQL на  клиенте?

• Задачи  обработки  данных– Выбор  (SELECT,  REMOVE COLUMNS)– Сортировка (ORDER  BY)– Группировка (GROUP  BY)– Фильтрация (WHERE,  HAVING)– Соединение  (JOIN)

• Импорт/экспорт  в  различные  форматы– Excel,  CSV,  TXT,  Google Spreadsheets

• Хранение  данных  на  клиенте

4

Page 5: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

5

Page 6: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Почему  бы  не  использовать  только  «большие»  базы  данных?• Плохая  связь• Хранение  данных  на  клиенте• Быстрый  фронт-­‐энд  для  приложений  BI

6

Page 7: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Какие  решения  уже  существуют?• Встроенные  базы  данных– WebSQL– IndexedDB

• SQL  на  JavaScript– SQL.js– SequelSphere

• “Почти” SQL– Lovefield– ydb-­‐db– pouchDB

7

Page 8: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Как  можно  использовать  SQL  в  программе  на  JavaScript?<script   src="alasql.min.js"></script>    

<script>

alasql(`CREATE   TABLE cities  (  

city  string,   population   number)`);

alasql(`INSERT   INTO cities   VALUES

('Rome',2863223),   ('Paris',2249975),

('Berlin',3517424),   ('Madrid',3041579)`);

console.log(   alasql(`SELECT *  FROM cities  

WHERE population   <  3500000

ORDER  BY population   DESC`)   );

</script>8

Page 9: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

SQL  +  JavaScript  – лучше  вместе!

9

Page 10: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Как  с  помощью  SQL  обрабатывать  данные  JavaScript  ?

var data  =  [{a:10},{a:2},{a:25}];

var res  =  alasql('SELECT  a  FROM  ?  WHERE a  >  2ORDER  BY a  DESC',[data]);

10

Page 11: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Синхронный  API

var res  =  alasql('SELECT *  FROM one',[params]);

11

Page 12: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Асинхронный  API(для  операций  с  файлами)

alasql('SELECT *  FROM two',  [params],    function  (data,err) {

if  (err)  throw err;console.log(data)

});

12

Page 13: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Обещанный  API  J(Promises)

alasql.promise('SELECT *  FROM two',  [params]).then(...).catch(...);  

13

Page 14: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

AlaSQL

Менеджеры  пакетов:npmBowerMeteor

Подключение• CommonJS• AMD• <script>

14

Page 15: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Зависимости

• Нет• xlsx-­‐js,  TableTop,  AngularJS,  Meteor  -­‐ для  отдельных  операций  импорта-­‐экспорта

• Есть  свои  плагины

15

Page 16: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

WebWorker<script src="alasql-­‐worker.min.js"></script><script>

var arr =  [{a:1},{a:2},{a:1}];alasql('SELECT *  FROM ?',[arr], function(data) {

console.log(data);});

</script>  

или  изнутри  WebWorker:

importScripts(‘alasql.min.js’);

16

Page 17: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

SQL-­‐92

• SELECT• INSERT• DELETE• UPDATE• CREATE  TABLE• CREATE  VIEW• CREATE  UNIQUE  INDEX• CREATE  DATABASE• и  другие  операторы

• Ограничения:– Триггеры (будут)– Транзакции– GRANTы

17

Page 18: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Тесты  на  совместимость с  SQL

• SQLLOGICTEST– 140000  запросов– 95% на  SELECT– 65%  по  всем

• NIST  SQL• несколько  тысяч

• Unit  Tests– около  300 тестов  (900  asserts)

18

Page 19: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

19

Page 20: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

CREATE  TABLE [Кошки]  (catid STRING  PRIMARY  KEY,catname NVARCHAR(MAX),

);

CREATE  TABLE `Мышки`  (mouseid STRING  PRIMARY  KEY,catid STRING  REFERENCES Cats(catid),weight  FLOAT

);

20

Page 21: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Расчет  диеты

INSERT  INTO  [Мышки]  VALUES ("Микки","Мурка",70),

("Мини","Мурка",50),("Джерри","Том",65);

21

Page 22: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Расчет  диеты

SELECT catname,  SUM([Мышки].weight)FROM [Кошки]JOIN [Мышки] USING catidGROUP BY catid

22

Page 23: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Все  JOINы на  свете…

• CROSS  JOIN• INNER  JOIN• LEFT  OUTER  JOIN• RIGHT  OUTER  JOIN• FULL  OUTER  JOIN• SEMI  JOIN• ANTI  JOIN• NATURAL  JOIN

• ON  • USING

• CROSS  APPLY  /  OUTER  APPLY

• ROLLUP,  CUBE,  GROUPING  SETS

• CTE

23

Page 24: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Обработка  данных  JSONSELECT  {a:1,b:2}

{a:1,b:2}

SELECT  {a:1,b:2}  ==  {a:1,b:2}true

SELECT  {a:1,b:2}-­‐>b2

SELECT  {a:1,b:(2*2)}-­‐>b4

SELECT  @[1,2,3,(b+4)]  FROM @[{b:100}][1,2,3,104]

24

Page 25: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

25

Page 26: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

РЕШЕНИЕЗАДАЧ  ETL

Извлечение,  обработка,  загрузка  данных

26

Page 27: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

27

Page 28: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

28

Page 29: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Пример:  Подготовка  данных  для  Google  Maps из  Slideshare.com

29

Данныепо  

просмотрам

XLSX(на  сервере)

Гео  данныепо  странам

CSV(в  

Интернете)

Данныепо  

просмотрампо  странамс  указаниемширотыи  долготы

МассивJavaScript

slideshare.com

github.com

GoogleMaps  APIJOIN

Page 30: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

SELECT countries.*,  views.cntFROM (

SELECT Country,  COUNT(*)  AS  cntFROM "all_latest_views.csv"GROUP  BY Country

)  AS viewsJOIN (

SELECT *FROM "https://countries.csv"

)  AS countries  USING Country

30

Page 31: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Пользователи  AlaSQLпо  всему  свету

31

Page 32: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Alacon -­‐ утилита  для  ETL

>  alacon “SELECT 2+2”

4

>  alacon "SELECT *  INTO'medals.csv’   FROM'medals.xlsx'  

WHERE Year=2008"

32

Page 33: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

ХРАНЕНИЕДАННЫХ  НАКЛИЕНТЕ 33

Page 34: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

IndexedDB:SELECT *  FROM  t  WHERE a>1function  selectFromTable (databaseid,  tableid,  cb,  cond)  {

var request  =  window.indexedDB.open(databaseid);request.onsuccess =  function(event)  {

var res  =  [];var ixdb =  event.target.result;var tx =  ixdb.transaction([tableid]);var store  =  tx.objectStore(tableid);var cur  =  store.openCursor();cur.onsuccess =  function(event)  {

var cursor  =  event.target.result;if(cursor)  {

if(cursor.value.a >  1)  res.push(cursor.value);cursor.continue();

}  else  {ixdb.close();cb(res);

}}

}}   34

Page 35: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

IndexedDBATTACH INDEXEDDB DATABASE geo;

SELECT *  FROM geo.countryWHERE continent_name =  "Asia";

35

Page 36: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

LocalStorageATTACH LOCALSTORAGE  DATABASE geo;

SELECT *  FROM geo.countryWHERE continent_name =  "Asia"');

36

Page 37: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Ваш  бэкэнд!alasql.engines.SUPERBASE =  function(){};

SB.createDatabase =  function(dbid,  params)  {//  Создать  свою  базу  данных  здесь

}

37

Page 38: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

ИНТЕГРАЦИЯС  ДРУГИМИПОПУЛЯРНЫМИБИБЛИОТЕКАМИ

Angular.jsd3.jsMeteor

38

Page 39: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Встроенная  интеграция

• Angular.js• d3.js• TableTop• Meteor

39

Page 40: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Alasql для  d3.js:Олимпийские  медали  из  Excel

40

Page 41: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Берем  медали…

SELECT ${axe},  SUM([Gold  Medals])  AS Gold,  SUM([Silver  Medals])  AS Silver,  SUM([Bronze  Medals])  AS Bronze  FROM "medals.csv"  GROUP  BY  ${axe}  ORDER  BY  ${axe}

41

Page 42: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

42

Page 43: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

ЗА  РАМКАМИSQL

Графы,  объекты

43

Page 44: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Парсер SQL  (AST-­‐дерево)var ast =  alasql.parse(`

SELECT SUM(x) FROM one`);

{  statements:  [  {  columns:  [{

aggregatorid:  'SUM',  expression:{columnid:   ‘x’},  over:  undefined  },

from:  [Object],  }  ]  }

44

Page 45: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Поиск  по  дереву

SEARCH /+  aggregatorid

['SUM’]

45

Page 46: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

46

Page 47: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Как  связаны  Саша  и  Марина?

SEARCH /  "Саша”  PATH("Марина")  EDGE  SET(color="red”)

47

Page 48: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

48

Page 49: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

ПОД  КАПОТОМ

49

Page 50: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Как  устроен  AlaSQL изнутри?

• Лексер• Парсер• Интерпретатор• Критические  участки  SELECT/INSERT/DELETE/UPDATE/SEARCH  компилируются  в  JS

• (картинка  – компиляция  -­‐ магия)

50

Page 51: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Компиляция

SELECT *  FROM data  ORDER BY  alpha,  beta

var s =  `if(a.alpha>b.alpha)  {return  1;  else if(a.alpha==b.alpha)  return  0;

if(a.beta>b.beta)  {return  1;  else  if(a.beta==b.beta)  return  0;

}}return  -­‐1;`;

var sortFn =  new  Function(‘a,b’,s);

var data  =  data.sort(sortFn);

51

Page 52: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

52http://jsperf.com/alasql-­‐js-­‐vs-­‐websql/7

Page 53: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

53

SELECT MAX(cnt)  FROM  (SELECT COUNT(*)  AS cnt

FROM ?  GROUP  BY _)

Page 54: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

54

Page 55: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

55

Page 56: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Итак,  AlaSQL…

• Простая  библиотека  

• SQL  +  JavaScript• Расширяемая• Интегрируемая• Удобная

56

Page 57: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

57

Page 58: AlaSQL - wsd.events · PDF file– WebSQL – IndexedDB • SQL$на$JavaScript – SQL.js – SequelSphere • “Почти”SQL – Lovefield – ydb—db – pouchDB 7. Как$можно$

Контакты• github.com/agershun/alasql• alasql.org

• Андрей  Гершун• [email protected]• @agershun

58

à laSQL