37
palais des congrès Paris 7, 8 et 9 février 2012

Fast and Furious XAML Apps!

Embed Size (px)

DESCRIPTION

Pour les utilisateurs la réactivité d'une application est un critère très important et une des clés de la réussite d'un projet. Dans cette session, vous découvrirez les bonnes pratiques pour réaliser des applications fluides et performantes en Silverlight, Windows Phone et WPF.

Citation preview

Page 1: Fast and Furious XAML Apps!

palais des congrès Paris

7, 8 et 9 février 2012

Page 2: Fast and Furious XAML Apps!

7 février 2012Cyril SANSUSBewise

Fast and Furious XAML Apps!

Page 3: Fast and Furious XAML Apps!

@csansus codes-sources.com/vko

Cyril Sansus

Responsable [email protected]

Page 4: Fast and Furious XAML Apps!

Retrouvez nous sur le stand 47

Diffuse une expertise novatrice

Contribue à l’émergence de logiciels performants et ergonomiques

Pure Player Microsoft depuis 1999

Toulouse Aix

Ouverture d’une agence surParis !

Page 5: Fast and Furious XAML Apps!

FluiditéPerformance Réactivité

Des solutionssimples

Facteur important d’adhésion

Les pièges à éviter

Des exemples concrets

Page 6: Fast and Furious XAML Apps!

Expérience de chargement

Page 7: Fast and Furious XAML Apps!

DEMO

Chargement …Veuillez patienter, un conseiller va vous répondre…

Page 8: Fast and Furious XAML Apps!

Chargement efficace

Retour utilisateurNe pas bloquerSimuler la lenteur

BusyIndicatorAsynchronismeThread.Sleep

Ce qu’il faut faire Les outils

Page 9: Fast and Furious XAML Apps!

ThreadThreadPoolBackgroundWorkerDélégué asynchroneTPL Async

Accès aux WebServicesWebRequest, SocketFile / Isolated StorageAccès base de donnéesTraitement lourd

Asynchronisme

Page 10: Fast and Furious XAML Apps!

DEMO

Chargement efficaceAsynchronisme

Page 11: Fast and Furious XAML Apps!

A retenir

Retour utilisateur

Facilitez-vous l’asynchronisme

Attention au LazyLoading

Ralentissez vos traitements

Page 12: Fast and Furious XAML Apps!

XAML

Page 13: Fast and Furious XAML Apps!

DEMO

Trop de XAML,tue le XAML

Page 14: Fast and Furious XAML Apps!

Chargement du XAML

animations saccadées

différer le chargement

blocage

chargement à volée

Le chargement du XAML c’est « long »

Cas : XAML trop volumineux

Page 15: Fast and Furious XAML Apps!

DEMO

Différer le chargement

Page 16: Fast and Furious XAML Apps!

DEMO

Encore plus loin !On peut mentir 1 fois à 1000 personnes …

Page 17: Fast and Furious XAML Apps!

A retenir

Le temps de chargement du XAML peut pénaliser les performances

1ms peut rapidement devenir 100ms

Utilisez les ResourceDictionnary

Ne jamais mettre de UserControl dans des DataTemplate

Page 18: Fast and Furious XAML Apps!

Layout

Page 19: Fast and Furious XAML Apps!

Layout

Calcule la taille

CPU

Calcule la position

Très fréquent

Pour chaque élément

Exécution

Thread UI

Load

Scroll

Margin

Redimentionnement

Mauvais layoutRedimentionnement lent

Chargement, animations saccadées

Page 20: Fast and Furious XAML Apps!

Optimisation

<UserControl> <Grid x:Name="LayoutRoot"> <StackPanel> <Button /> <Button /> </StackPanel> </Grid></UserControl>

<StackPanel><Button /><Button />

</StackPanel>

<ControlTemplate> <Grid> <Border> <Rectangle Fill="Black"/> <ContentPresenter /> </Border> </Grid></ControlTemplate>

<ControlTemplate> <Border Background="Black"> <ContentPresenter /> </Border> </ControlTemplate>

99% des UserControls sont inutiles

Supprimez tout ce qui est inutile

Page 21: Fast and Furious XAML Apps!

Mesurer les performances

WPF Performance Tools

Utilisez l’évènement LayoutUpdated

Autres outils

Snoop Silverlight Spy …

Page 22: Fast and Furious XAML Apps!

Animations

Page 23: Fast and Furious XAML Apps!

Qui dit fluidité, dit animation

interaction avec le Layout

différence de comportement

Terminal Server, Citrix

désactivez les animations

ajustez le framerate

décrochage

Utilise le CPU

Dependency Property

Page 24: Fast and Furious XAML Apps!

DEMO

Animation / WPF Performance SuiteEtre fluide, ou ne pas l’être

Page 25: Fast and Furious XAML Apps!

Binding

Page 26: Fast and Furious XAML Apps!

Binding

vérifiez l’output

préparez vos données en amont

Erreur et warning

Converter

mise en cache

Performant

peu compressible

Page 27: Fast and Furious XAML Apps!

Virtualisation d’UI

Page 28: Fast and Furious XAML Apps!

Présentation

Item 5Item 6Item 7Item 8Item 9Item 10Item 11Item 11

Item 2Item 3Item 4 Permet

d’afficher des liste de plusieurs millions d’éléments

Page 29: Fast and Furious XAML Apps!

DEMO

VirtualisationDésactivation

Page 30: Fast and Furious XAML Apps!

A retenir

Ne jamais désactiver la virtualisationDésactivation de la virtualisation Regroupement de données IsVirtualizing = False CanContentScroll=False

Activez le recyclage ItemsControl : pas de virtualisation par défaut

Page 31: Fast and Furious XAML Apps!

DataGrid

Page 32: Fast and Furious XAML Apps!

DEMO

DataGrid Fast And Furious DataGrid !

Page 33: Fast and Furious XAML Apps!

Comment ça marche ?

Temporisation

Pas de Add/Remove

Optimisation du Layout

Optimisation de la Virtualisation

Uniquement du TranslateTransform

Visibility=Collapsed

Page 34: Fast and Furious XAML Apps!

Tips & tricks

Page 35: Fast and Furious XAML Apps!

Trucs et astuces

Toujours tester sur le device cibléImpact de la résolutionLaptop débranché, économie d’énergieRalentissez vos traitementsAugmenter le volume de donnéesImpact de Debug et Trace

Page 36: Fast and Furious XAML Apps!

Chaque semaine, les DevCampsALM, Azure, Windows Phone, HTML5, OpenDatahttp://msdn.microsoft.com/fr-fr/devcamp

Téléchargement, ressources et toolkits : RdV sur MSDNhttp://msdn.microsoft.com/fr-fr/

Les offres à connaître90 jours d’essai gratuit de Windows Azure www.windowsazure.fr

Jusqu’à 35% de réduction sur Visual Studio Pro, avec l’abonnement MSDN www.visualstudio.fr

Pour aller plus loin

10 février 2012

Live Meeting

Open Data - Développer des applications riches avec le protocole Open Data

16 février 2012

Live Meeting

Azure series - Développer des applications sociales sur la plateforme Windows Azure

17 février 2012

Live Meeting

Comprendre le canvas avec Galactic et la librairie three.js

21 février 2012

Live Meeting

La production automatisée de code avec CodeFluent Entities

2 mars 2012

Live Meeting

Comprendre et mettre en oeuvre le toolkit Azure pour Windows Phone 7, iOS et Android

6 mars 2012

Live Meeting

Nuget et ALM

9 mars 2012

Live Meeting

Kinect - Bien gérer la vie de son capteur

13 mars 2012

Live Meeting

Sharepoint series - Automatisation des tests

14 mars 2012

Live Meeting

TFS Health Check - vérifier la bonne santé de votre plateforme de développement

15 mars 2012

Live Meeting

Azure series - Développer pour les téléphones, les tablettes et le cloud avec Visual Studio 2010

16 mars 2012

Live Meeting

Applications METRO design - Désossage en règle d'un template METRO javascript

20 mars 2012

Live Meeting

Retour d'expérience LightSwitch, Optimisation de l'accès aux données, Intégration Silverlight

23 mars 2012

Live Meeting

OAuth - la clé de l'utilisation des réseaux sociaux dans votre application

Prochaines sessions des Dev Camps

Page 37: Fast and Furious XAML Apps!

Q/A merci

[email protected]