Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Кросс-платформенная мобильная разработка

357 views

Published on

Кросс-платформенная мобильная разработка, Xamarin, ReactNative и прочее

Published in: Software
  • Be the first to comment

  • Be the first to like this

Кросс-платформенная мобильная разработка

  1. 1. / DP Labs
  2. 2. Артур Дробинский Ведущий архитектор команды DP Labs arturdr.ru artur.drobinskiy@arturdr.ru
  3. 3. Зачем кросс- платформенность?
  4. 4. Везде используем универсальный инструмент
  5. 5. iOS Android Core Повторное использование кода
  6. 6. iOS Android Core Повторное использование кода
  7. 7. iOS Android Core Windows
  8. 8. Проще поддержка – исправляем баги один раз
  9. 9. Дешевле!
  10. 10. Кросс-платформенные решения
  11. 11. How does it work?
  12. 12. Cross-platform code
  13. 13. Cross-platform code Native .apk / .ipa / .exe (application package)
  14. 14. Cross-platform code Native .apk / .ipa / .exe (application package) UI, Native controls Native API
  15. 15. Cross-platform code Native .apk / .ipa / .exe (application package) UI, Native controls API Bridge Native API
  16. 16. PhoneGap
  17. 17. Code: JS Native .apk / .ipa / .exe (application package) UI: HTML Limited API Bridge Native API PhoneGap WebView
  18. 18. Qt
  19. 19. Code: C++/C# Native .apk / .ipa / .exe (application package) UI: QML/Game Engine Limited API Bridge Native API Qt/Unity View (Canvas)
  20. 20. Code: C# Native .apk / .ipa / .exe (application package) API Bridge Native API Xamarin Native Controls
  21. 21. Code: V8, JS Native .apk / .ipa / .exe (application package) Limited API Bridge Native API React Native JSX Native Controls API Bridge
  22. 22. Performance
  23. 23. 4.342 94.151 4.258 1 10 100 Java Cordova Xamarin Android 5.014 67.291 4.349 1 10 100 Objective-C Cordova Xamarin iOS Математические вычисления
  24. 24. 0.551 1.117 0.601 0 0.2 0.4 0.6 0.8 1 1.2 Java Cordova Xamarin Android 0.792 1.494 0.735 0 0.2 0.4 0.6 0.8 1 1.2 1.4 1.6 Objective-C Cordova Xamarin iOS SQLite: чтение данных
  25. 25. 1.044 4.068 1.689 3.032 0 0.5 1 1.5 2 2.5 3 3.5 4 4.5 Java Cordova Xamarin Xamarin.Forms Android 1.14 6.21 1.204 1.928 0 1 2 3 4 5 6 7 Objective-C Cordova Xamarin Xamarin.Forms iOS Запуск приложения
  26. 26. 166 433 3500 4700 0 500 1000 1500 2000 2500 3000 3500 4000 4500 5000 Java Cordova Xamarin Xamarin.Forms Android 644 2700 12100 16900 0 2000 4000 6000 8000 10000 12000 14000 16000 18000 Objective-C Cordova Xamarin Xamarin.Forms iOS Размер приложения
  27. 27. Xamarin React Native Phonegap
  28. 28. Xamarin React Native Phonegap
  29. 29. DEMO
  30. 30. React Native
  31. 31.  Hype  Hot reloading + простое обновление приложений  Javascript  Встраивание в нативные приложения Плюсы
  32. 32.  Breaking Changes  Second class android support  Javascript & TypeSafety  Animations are slow (bridge)  Неполная поддержка нативных контролов, ненативная разметка Минусы?
  33. 33. Xamarin Xamarin Forms React Native
  34. 34. Xamarin Мифы или реальность?
  35. 35. Утечки памяти и особенности Garbage Collection
  36. 36. UIKit.UIButton (peer object) UIButton (native object) API Bridge Использование open-source контролов Необходимо написание собственных API Bridge
  37. 37. На Xamarin нет приложений
  38. 38. easyJet Slack Credit Agricole
  39. 39. React Native 
  40. 40. https://www.xamarin.com/customers/
  41. 41.  Размер приложения (6MB+)  Большее время запуска приложения  Использование open-sourced controls требует поиска/написания обёртки Минусы Xamarin (и ReactNative)
  42. 42. Xamarin vs Native
  43. 43. Xamarin  Сложные Enterprise приложения  Существующая команда C# разработчиков  Бэкенд на .NET  Похожие экраны/workflow на разных устройствах Native  Дублирование бизнес-логики – не проблема (её мало)  Команда с опытом на Obj-C и Java  Бэкенд на Java   Workflow на Android/iOS радикально различный
  44. 44. Xamarin vs React Native
  45. 45. Xamarin  Сложная бизнес логика  C#-команда  Использование всех нативных возможностей  Компиляция, производительность  UWP + Mac (+ Web)  XAML + Native rendering + Flexbox React Native  UI-heavy apps  JS-команда  Встраивание в нативные приложения  Быстрое обновление (AppStore, Google Play)  Задержка с новыми фичами на платформах (+ Web)  Flexbox (but only flexbox)
  46. 46. Вопросы? http://arturdr.ru artur.drobinskiy@arturdr.ru
  47. 47. <ListView ItemsSource="{Binding MonkeysGrouped}" ItemTapped="Handle_ItemTapped" ItemSelected="Handle_ItemSelected" HasUnevenRows="true" GroupShortNameBinding = "{Binding Key}" IsGroupingEnabled = "true" GroupDisplayBinding = "{Binding Key}"> <ListView.ItemTemplate> <DataTemplate> <ViewCell> <Grid Padding="10" RowSpacing="10" ColumnSpacing="10"> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="Auto"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <controls:CircleImage BorderColor="Aqua" BorderThickness="3" HeightRequest="66" HorizontalOptions="CenterAndExpand" Vertical`Options="CenterAndExpand" Aspect="AspectFill" WidthRequest="66" Grid.RowSpan="2" Source="{Binding Image}"/> <Label Grid.Column="1" Text="{Binding Name}" VerticalOptions="End"/> <Label Grid.Column="1" Grid.Row="1" VerticalOptions="Start" Text="{Binding Location}"/> </Grid> </ViewCell> </DataTemplate> </ListView.ItemTemplate> </ListView>
  48. 48. <View style={[styles.container, {backgroundColor: this.props.backgroundColor}]}> <View style={styles.labelContainer}> <Text style={labelStyles}> {this.state.maxValue} </Text> </View> <View style={styles.itemsContainer}> <View style={[styles.polygonContainer, {borderColor: this.props.borderColor}]}> {this.renderBars()} </View> <View style={styles.itemsLabelContainer}> {this.renderLabels()} </View> </View> </View>
  49. 49. = Xamarin.Forms
  50. 50. = Xamarin.Forms <

×