delivering native user experience in client side java applications
TRANSCRIPT
Delivering Native UX in client-side Java applications
Nikita Lipsky
Excelsior LLC
1
2
Web 3.0 – уже сейчас!
3
Native apps
• Нативные приложения– Отзывчивы
– Выразительны
– Удобны
– Имеют доступ ко всем ресурсам устройства, которые пожелают
Текущие скорости интернета позволяют их доставлять до пользователя быстро
4
Десктоп vs. мобайл
• Планшеты – для потребления контента
• Десктопы – для создания контента
• Тенденция слияния десктопных и планшетных OC:– Windows Surface, Universal apps
– OS X / iOS
– Linux для планшетов
5
Причины написания приложения под десктоп
• Доступ к локальной файловой системе
• Возможность работы оффлайн
• Отзывчивость системы
• Эффективность разработки сложного ПО
• Независимость от браузера, установленного у пользователя
6
Проблема: кросс-платформенная разработка
7
8
Кросс-платформенная разработка
• QT / C++
• WebKit / JavaScript + HTML5 / C++
• Java
• Mono / Xamarin / .NET Core
9
План доклада
• Обзор UI фреймворков для Java
• Аспекты native UX:
– установка
– старт
– look-n-feel
– восприятие пользователем
10
Кто знает про себя ?
• Более 20 лет профессиональной карьеры• Инициатор проекта Excelsior JET
– работал над проектом более 16 лет– как идейный вдохновитель– компиляторный инженер– руководитель– и много в каких еще ролях
• Open source проекты WebFX и Java ReStart– в свободное от работы время
• twitter: @pjBooms
Кто знает про Excelsior JET?
• Полная реализация Java SE– c 2005 года cертифицирована как Java Compatible
• AOT compiler + Java Runtime– смешанная компиляция: AOT + JIT– поддержка нестандартных загрузчиков классов в
AOT режиме (для Eclipse RCP, Tomcat)
• Toolkit– Startup Optimizer– Deployment
12
Кто знает про Excelsior JET?
Кто знает про Excelsior JET?Кто знает про Excelsior JET?
13
UI фреймворки для Java
14
UI фреймворки для Java SE
• AWT/Swing
• SWT/JFace
• LibGDX, JOGL
• JavaFX
15
Swing
• Входит в стандарт Java SE
• Самописные контролы/эмуляция контроловОС
• Cменяемый look-n-feel
• Netbeans, IntelliJ IDEA
16
SWT
• Библиотека, разработанная IBM
• Родные (native) контролы
• Eclipse
17
SWT vs. Swing
18
SWT vs. Swing
• Pros Swing
– легкость настройки look-n-feel
– можно сделать лучше чем native (JIDE, Alloy)
• Cons Swing
– по умолчанию look-n-feel не совсем native
– многие look-n-feel по умолчанию находят “убогим”
19
SWT vs. Swing
• Pros SWT
– действительно native look-n-feel
– легковесный ~2M (работает на compact1 / Apache Harmony / GCJ)
– может работать поверх Swing/JavaFX
• Cons SWT
– тяжело сделать уникальный look-n-feel
– такой же “убогий” как UI операционной системы
20
Rich Client Platforms
• Для сложных систем по созданию контента:
– IDE, графические редакторы, системы управления, CRM, научное моделирование, бизнес аналитика, и т.д.
– используются во многих отраслях: оборонная промышленность, космос, транспорт, автопром, наука и т.д.
21
Rich Client Platforms
• Модульность
• Готовый каркас: workspace, project, layout
• Средства распространения, обновления
22
Rich Client Platforms
• Eclipse RCP (Equinox OSGi)
– https://eclipse.org/community/rcpcp.php
• Netbeans RCP (Netbeans modules)
– https://netbeans.org/features/platform/showcase.html
• IntelliJ Platform (IntelliJ plugins)
– JetBrains IDEs, Google Android Studio
23
Кто использует Java based RCP
24
JavaFX
• Scene graph
• Анимация, визуальные эффекты
• FXML, CSS
• Скриптовые языки: JavaScript, Groovy, JRuby
• Multi touch
• Бизнес-графика, media, 3D
• Аппаратное ускорение графики
• HTML5 & WebView (на основе WebKit)
25
Scene Graph vs. Layout Managers
Layout Manager
Scene Graph
28
JavaFX WebView
29
JavaFX Hybrid Apps
30
Десктопные приложения вместо веба с апплетами
Кто использует JavaFX
32
http://www.oracle.com/technetwork/java/javase/community/javafx-community-2158661.html
JavaFXPorts.org
• iOS & RoboVM
• Android & LodgON
34
Native clients
35
Native clients
• Правило №1:
– Ваш пользователь не должен знать, что такое Java. Не должен!
• Решение:
– Ваше приложение должно запускаться как .exe целевой платформы
– Не зависеть от Java, установленной у клиента
37
Java to Exe
Сделать из Java исполняемый файл целевой платформы не просто …
38
Java to Exe
Сделать из Java исполняемый файл целевой платформы не просто
а очень просто!
39
Java to Exe
Сделать из Java исполняемый файл целевой платформы не просто
а очень просто!
И совершенно бесплатно!
40
Java to Exe
• Можно самому
– Invocation API
• Много бесплатных (и платных) инструментов
– Launch4J
– Exe4J
– etc.
Tip: Google “Java to Exe”
41
Native bundle
Чтобы устранить зависимость от JRE нужно …
42
Native bundle
Чтобы устранить зависимость от JRE нужно
просто включить JRE целиком
в состав приложения
43
Native bundle
Чтобы устранить зависимость от JRE нужно
просто включить JRE целиком
в состав приложения
Это абсолютно легально по лицензии на JRE (но включать надо все файлы JRE, за редким исключением)
44
Native bundle
Self-contained directory:
45
Native bundle
Теперь ваше приложение распространяется простым копированием
– можно завернуть в дистрибутив целевой платформы
Бесплатные инсталляторы: WiX, InnoSetup, NSIS, Excelsior Installer
Платные: InstallAnywhere, InstallShield
46
Java-aware инсталляторы
• Java Packager (требует WiX или InnoSetup)– Ant task– Maven plugin
(https://github.com/javafx-maven-plugin/javafx-maven-plugin )
• IzPack (free)
• Install4J (commercial) – Instant splash– Autoupdates– И много чего еще
47
Native bundle
• Private JRE увеличивает дистрибутив на 30-70 MB
Можно ли уменьшить эти издержки?
48
Small Private JRE
• Лицензия на Oracle JRE запрещает его “уменьшать”
• Альтернативные открытые реализации Java:
– OpenJDK
– Apache Harmony/Android classlib
– GNU Classpath
49
Compact Profiles
Compact1 Compact2 Compact3
java.lang java.rmi java.lang.instrument
java.io java.sql java.lang.management
java.math javax.transaction javax.management
java.nio javax.xml javax.naming
java.util org.w3c.dom javax.script
java.net org.xml.sax javax.security
java.security javax.sql
javax.crypto javax.xml.crypto
java.text org.ietf.jgss
51
Есть в Java SE Embedded и OpenJDK
Compact Profiles: размеры
• Compact1: 11MB
• Compact2: 15MB
• Compact3: 21MB
Замечание: размеры на диске (ROM)
52
Project Jigsaw
53
Excelsior Java Runtime Slim-Down
• Java SE API делится на компоненты:– Kernel, XML, SQL, CORBA, AWT/Java2D, Swing, etc.
• анализатор определяет какие компоненты “нужны”– содержат достижимые методы
54
Глобальный анализатор
Application
Java SE API
Entry points- used- not used- component’s boundary
55
Java Runtime Slim-Down• Пользователю предоставляются:
– результаты анализа c возможностью исключить неиспользуемые компоненты
56
Java Runtime Slim-Down
• Исключенные компоненты:– помещаются на веб-сервер (доступны
приложению)
– загружаются VM по требованию
• Соответствует Java SE спецификации!
57
Java Packager vs. Runtime Slim-Down
Java Packager Java Runtime Slim-Down
Ensemble Demo 41 MB 20 MB
BrickBreaker 37 MB 12 MB
58
Cтарт приложения
59
Что делает JVM на старте
60
JVM with AOT
61
62
Как ускорить старт без AOT
• Instant splash
• Выяснить, какие классы грузятся на старте, и перепаковать ваши jars в порядке загрузки классов
– VM arg: -verbose:class
• Упаковать все jar в один (One-Jar, Autojar)
63
Look-n-feel
64
Look-n-feel
Миф о native look-n-feel:
Приложение только тогда нативное,когда оно выглядит ”привычно” для конечного пользователя и похоже на другие приложения данной операционной системы
65
“Native” Look-n-feel
66
мгновенное отклик
“Native” Look-n-feel
67
Look-n-feel
• Приложение воспринимается как родное:
– интуитивно понятный интерфейс
– мгновенный отклик
– выглядит хорошо
– UI разработан профессионалами в областях графического дизайна и UX
– с учетом HIG (human interface guidelines) целевой платформы
68
“Native” Look-n-feel
69
мгновенное отклик
Look-n-feel
Мечта дизайнера:
–Делать программы без программистов
70
JavaFX Scene Builder
71
JavaFX Scene Builder
• Действительно WYSIWYG
– Манипуляция ровно теми же объектами, что и потом “идут в бой”
• Порождает FXML
– Понимает рукописный FXML
• Легко расширяется вашими контролами
– Как first class citizen
• Сейчас – open source
72
Отзывчивость UI
73
Отзывчивость UI
74
Отзывчивость UI
75
Отзывчивость UI
• JIT хорошо работает для горячего кода
• UI приложения – пример приложений без ярко выраженного горячего кода
– Профиль исполнения практически плоский
– JIT долго греется
• AOT работает лучше, оптимизируя каждую строчку кода максимально агрессивно
76
JFCMark (Short Run)
0%
50%
100%
150%
200%
250%
2 core Celeron, 2.6Ghz 4 core i5, 3.8Ghz
Excelsior JET
HotSpot client
HotSpot server
77
Больше – лучше
JFCMark (Long Run)
0%
20%
40%
60%
80%
100%
120%
140%
160%
2 core Celeron, 2.6Ghz 4 core i5, 3.8Ghz
Excelsior JET
HotSpot client
HotSpot server
78
Больше – лучше
Заключение
• Javа прекрасно подходит для client side– кросс-платформенна– богатый выбор UI фреймворков
• JavaFX – потрясающая технология – практически готова для mobile
• Native bundle для Java приложения – легко!– уникально именованный процесс– независимость от Java у пользователя
• Проектировка UI & UX – дело профессионалов– дизайнеры наше все
• AOT улучшает UX
79