Алексей Охрименко Acronis
Isomorphic D3 + MALEVICH
1
2
• D3 • Isomorphic D3 • D3 and WebWorkers • MALEVICH —> COD.js
3
D3
4
DEMO - stage concept
5
6
Isomorphic D3
7
8
DEMO - isomorphic
9
11
jsdom4browser позволяет работать с DOM в
WebWorker
12
MALEVICH —> COD.js
новый паттерн программирования и новый фреймворк
13
Зачем?
14
15
M/S
VC
VM
бизнес-логика, валидация
визуальное представление
кэш, синхронизация с сервером
реакция на события
JSON only!
16
M/S
VC
VM
Main
Sidebar
M/S
VC
VM
M/S
VC
VM
Menu
17
COD.js новый фреймворк на базе MALEVICH
18
19
git clone https://github.com/aiboy/COD.js.git cd COD.js rm -rf .git
npm install npm run dev npm run watch
DEMO - COD.js
22
Плюсы COD.jsD3 «Virtual Data/DOM» + DOM recycling! ( в 2012 году на 1 год раньше чем React )
Полуавтоматическое обнаружение ошибок ( в следующей версии - полуавтоматическое с указанием конкретной строчки кода )
Неимоверная скорость и отзывчивость UI (даже на мобильных девайсах)
Легкий рефакторинг и просто тестирование - By Design
Почти бесплатный Drag&Drop
24
Минусы COD.js
Семантика теряется по дороге (No SEO) ( можно исправить используя React as View )
Отсутствие нормальной документации и примеров ( будет исправлено в ближайшем будущем )
25
• D3 • Isomorphic D3 • D3 and WebWorkers • MALEVICH —> COD.js
26
Алексей ОхрименкоWork@: Acronis
Twitter: @Ai_boy
https://gist.github.com/aiboy/366f0e6dc3c46730877e
https://github.com/aiboy/isomorphic-d3-and-malevich https://github.com/aiboy/jsdom4browser https://github.com/aiboy/MALEVICH
https://github.com/aiboy/COD.js
27