SlideShare uma empresa Scribd logo
1 de 32
Baixar para ler offline
Performance Tips & Tricks for Qt-QML Apps
               Rajesh Lal, Nokia
High Performance QML Applications


                         +                      =
      Qt Quick                    QML               MeeGo Apps
    Qt UI Creation Kit       Most Advanced UI       High Performance


2
Agenda


               QML
    Qt Quick         7 Tips   Tools
               App




3
What is Qt Quick
                   • QML
                   • IDE – Qt Creator
                   • Qt UI Designer
                   • Plugin for Mobility API
                   • Quick Components

     The Fastest way to develop for MeeGo

4
What is QML
                    • Qt Meta-Object Language
                    • JavaScript based
                    • Qt Declarative runtime
                    • CSS-JavaScript like syntax

    The Most Advanced UI technology for Mobile


5
QML

         Powerful
      Declarative
    User Interface
         language



6
QML Elements
    Graphics   Animation      Binding

     Items       State       Property
    Shapes     Transitions   JavaScript
      Text     Transform.       C++


7
What is a Qt QML App


                                      Logic in
                                      JavaScript or
                        UI in QML     C++ API calls
                        (main.qml)
       A Qt
       Container
       (main.cpp)

                    Qt Quick Application
8
Qt-QML App
                            QML App. Viewer
                                                  Property Bind
      1+ QML Files                                JavaScript
    Import libraries
                                          Logic
                                                  C++ Binding
     Import JS files
                             UI
                        1   | 2 | 3


                       Qt Container(main.cpp)
9
What is Performance

     •   Short response time
     •   High Throughput
     •   Low utilization of resources
     •   High availability
     •   High Speed
     •   Instant
     •   Smoothness

10
7 Tips for
     High Performance QML Application




11
Tip 1
     Divide and Rule




12
1: Divide and Rule

     •   Divide application UI into multiple QML files
     •   Each Logical entity as a separate QML file
     •   Think Object Oriented Programming
     •   Do not use 1 Large QML file




13
1: Divide and Rule

     Rule
     • Use main.qml as the main UI
        ₋ With different States & Transitions
        ₋ Create Multiple Views .QML files
        ₋ Import folders containing other QML files
        ₋ Local instances of imported QML elements



14
1: Divide and Rule




15
Tip 2
     Load and Unload




16
2: Load and Unload

     •   Use Loader to control the memory usage
     •   Load the absolute Minimum at the startup
     •   Dynamically Load and Unload UI Components
     •   Create Components when required




17
2: Load and Unload




18
Tip 3
     Use Asynchronous Threads




19
3: Asynchronous Threads

     •   Use WorkerScripts for Remote API Calls
     •   Use Threads for time consuming operations
     •   Load large images asynchronously
     •   Use caching for remote data/image
         (cacheBuffer in listview/Gridview)




20
3: Asynchronous Threads

Login call in MyApp.QML    MyAppScript/Login.QML file




 21
3: Asynchronous Threads

Js/dologin.js




22
Tip 4
        Optimize for Images
     (Greatest User of Memory)




23
4: Optimize for Images

     •   Optimize Images to reduce memory footprints
     •   Specify exact size of the image
     •   Avoid resizing/scaling an image in QML
     •   Lazy load large images (asynchronous=true)
     •   Don’t cache large images (cache=false)
     •   Smooth filter = better visual quality, but slower



24
Tip 5
     Beware of String Operations




25
5: Beware of String Operations

     •   Strings are immutable
     •   multiple '+' operator = multiple memory allocations
     •   Use StringBuilder for more efficient strings
     •   Define
         ₋ #define QT_USE_FAST_CONCATENATION
         ₋ #define QT_USE_FAST_OPERATOR_PLUS



26
Tip 6
     Know States, Transitions, & Animations




27
6: Know States, Transitions, & Animations

     •   In transition, animated area should be small
     •   Animate different items sequentially when possible
     •   Avoid multiple timers during animation
     •   Avoid JavaScript operations during animation
     •   Use ScriptAction & StateChangeScript




28
Tip 7
     Follow Best Practices




29
7: Best Practices

     •   For best performance use C++ instead of JavaScript
     •   Insert properties at top of element declarations
     •   Create application logic outside QML
     •   Don’t build multiple layer of QML hierarchies
     •   Use Qt's i18n for internationalisation & localisation




30
Tools
     QML Performance Monitor
     http://www.youtube.com/watch?v=XdI9C53uJw8

     Valgrind
     http://valgrind.org/docs/manual/mc-manual.html

     QML Performance Guidelines
     http://doc.qt.nokia.com/4.7/qdeclarativeperformance.html




31
Thank You
 @rajeshlalnokia

Mais conteúdo relacionado

Mais de Raj Lal

Workshop Stanford University - 28th July 2018 on Website Optimization
Workshop Stanford University - 28th July 2018 on Website Optimization  Workshop Stanford University - 28th July 2018 on Website Optimization
Workshop Stanford University - 28th July 2018 on Website Optimization Raj Lal
 
The art and science of website optimization
The art and science of website optimizationThe art and science of website optimization
The art and science of website optimizationRaj Lal
 
UX Workshop - Talent 2 Talent Conference, Ryerson University, Toronto Canada,...
UX Workshop - Talent 2 Talent Conference, Ryerson University, Toronto Canada,...UX Workshop - Talent 2 Talent Conference, Ryerson University, Toronto Canada,...
UX Workshop - Talent 2 Talent Conference, Ryerson University, Toronto Canada,...Raj Lal
 
Why Toastmasters - The story of a fisherman
Why Toastmasters - The story of a fishermanWhy Toastmasters - The story of a fisherman
Why Toastmasters - The story of a fishermanRaj Lal
 
Build Amazing Camera Apps for Superphones - Silicon Valley Code Camp, 6 Oct, ...
Build Amazing Camera Apps for Superphones - Silicon Valley Code Camp, 6 Oct, ...Build Amazing Camera Apps for Superphones - Silicon Valley Code Camp, 6 Oct, ...
Build Amazing Camera Apps for Superphones - Silicon Valley Code Camp, 6 Oct, ...Raj Lal
 
Evolution of User Interface - Digital Web & Design Innovation Summit SFO 20 S...
Evolution of User Interface - Digital Web & Design Innovation Summit SFO 20 S...Evolution of User Interface - Digital Web & Design Innovation Summit SFO 20 S...
Evolution of User Interface - Digital Web & Design Innovation Summit SFO 20 S...Raj Lal
 
Designing Killer Apps for Mobile Devices ModevUX May 9 2013 mclean VA - @iRajLal
Designing Killer Apps for Mobile Devices ModevUX May 9 2013 mclean VA - @iRajLalDesigning Killer Apps for Mobile Devices ModevUX May 9 2013 mclean VA - @iRajLal
Designing Killer Apps for Mobile Devices ModevUX May 9 2013 mclean VA - @iRajLalRaj Lal
 
Html5 Whats around the bend
Html5 Whats around the bendHtml5 Whats around the bend
Html5 Whats around the bendRaj Lal
 
Accessible design with html5 JS Everywhere 2012 Oct 26 Fairmont Hotel San Jos...
Accessible design with html5 JS Everywhere 2012 Oct 26 Fairmont Hotel San Jos...Accessible design with html5 JS Everywhere 2012 Oct 26 Fairmont Hotel San Jos...
Accessible design with html5 JS Everywhere 2012 Oct 26 Fairmont Hotel San Jos...Raj Lal
 
Accessibility on Windows Phone - Windows Phone Meetup at Nokia - 16 October @...
Accessibility on Windows Phone - Windows Phone Meetup at Nokia - 16 October @...Accessibility on Windows Phone - Windows Phone Meetup at Nokia - 16 October @...
Accessibility on Windows Phone - Windows Phone Meetup at Nokia - 16 October @...Raj Lal
 
Accessible design - HOW Interactive Design Conference Washington DC SEPT 27-2...
Accessible design - HOW Interactive Design Conference Washington DC SEPT 27-2...Accessible design - HOW Interactive Design Conference Washington DC SEPT 27-2...
Accessible design - HOW Interactive Design Conference Washington DC SEPT 27-2...Raj Lal
 
Accessible Design with HTML5 - HTML5DevConf.com May 21st San Francisco, 2012 ...
Accessible Design with HTML5 - HTML5DevConf.com May 21st San Francisco, 2012 ...Accessible Design with HTML5 - HTML5DevConf.com May 21st San Francisco, 2012 ...
Accessible Design with HTML5 - HTML5DevConf.com May 21st San Francisco, 2012 ...Raj Lal
 
Developing Apps for Nokia Windows Phone VSLiv Conference May 15, 2012 @iRajLal
Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLalDeveloping Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal
Developing Apps for Nokia Windows Phone VSLiv Conference May 15, 2012 @iRajLalRaj Lal
 
Upgrade Your Website to HTML5 - VSLive Conference New York @iRajLal
Upgrade Your Website to HTML5 - VSLive Conference New York  @iRajLalUpgrade Your Website to HTML5 - VSLive Conference New York  @iRajLal
Upgrade Your Website to HTML5 - VSLive Conference New York @iRajLalRaj Lal
 
Fun with silverlight4 Table of Content @iRajLal
Fun with silverlight4 Table of Content @iRajLalFun with silverlight4 Table of Content @iRajLal
Fun with silverlight4 Table of Content @iRajLalRaj Lal
 
Honeycomb User Interface Design @iRajLal
Honeycomb User Interface Design @iRajLalHoneycomb User Interface Design @iRajLal
Honeycomb User Interface Design @iRajLalRaj Lal
 
Two thumbs User Interface @iRajLal
Two thumbs User Interface @iRajLalTwo thumbs User Interface @iRajLal
Two thumbs User Interface @iRajLalRaj Lal
 
Angry Developer: Creating a Game in QML and JavaScript for MeeGo N9 @iRajLal
Angry Developer: Creating a Game in QML and JavaScript for MeeGo N9 @iRajLalAngry Developer: Creating a Game in QML and JavaScript for MeeGo N9 @iRajLal
Angry Developer: Creating a Game in QML and JavaScript for MeeGo N9 @iRajLalRaj Lal
 
Fun with QML and JavaScript: Embedded Linux Conference 11th April 2011, Hotel...
Fun with QML and JavaScript: Embedded Linux Conference 11th April 2011, Hotel...Fun with QML and JavaScript: Embedded Linux Conference 11th April 2011, Hotel...
Fun with QML and JavaScript: Embedded Linux Conference 11th April 2011, Hotel...Raj Lal
 
Build Cutting edge Mobile Apps using QML and JavaScript for MeeGo N9: Linux F...
Build Cutting edge Mobile Apps using QML and JavaScript for MeeGo N9: Linux F...Build Cutting edge Mobile Apps using QML and JavaScript for MeeGo N9: Linux F...
Build Cutting edge Mobile Apps using QML and JavaScript for MeeGo N9: Linux F...Raj Lal
 

Mais de Raj Lal (20)

Workshop Stanford University - 28th July 2018 on Website Optimization
Workshop Stanford University - 28th July 2018 on Website Optimization  Workshop Stanford University - 28th July 2018 on Website Optimization
Workshop Stanford University - 28th July 2018 on Website Optimization
 
The art and science of website optimization
The art and science of website optimizationThe art and science of website optimization
The art and science of website optimization
 
UX Workshop - Talent 2 Talent Conference, Ryerson University, Toronto Canada,...
UX Workshop - Talent 2 Talent Conference, Ryerson University, Toronto Canada,...UX Workshop - Talent 2 Talent Conference, Ryerson University, Toronto Canada,...
UX Workshop - Talent 2 Talent Conference, Ryerson University, Toronto Canada,...
 
Why Toastmasters - The story of a fisherman
Why Toastmasters - The story of a fishermanWhy Toastmasters - The story of a fisherman
Why Toastmasters - The story of a fisherman
 
Build Amazing Camera Apps for Superphones - Silicon Valley Code Camp, 6 Oct, ...
Build Amazing Camera Apps for Superphones - Silicon Valley Code Camp, 6 Oct, ...Build Amazing Camera Apps for Superphones - Silicon Valley Code Camp, 6 Oct, ...
Build Amazing Camera Apps for Superphones - Silicon Valley Code Camp, 6 Oct, ...
 
Evolution of User Interface - Digital Web & Design Innovation Summit SFO 20 S...
Evolution of User Interface - Digital Web & Design Innovation Summit SFO 20 S...Evolution of User Interface - Digital Web & Design Innovation Summit SFO 20 S...
Evolution of User Interface - Digital Web & Design Innovation Summit SFO 20 S...
 
Designing Killer Apps for Mobile Devices ModevUX May 9 2013 mclean VA - @iRajLal
Designing Killer Apps for Mobile Devices ModevUX May 9 2013 mclean VA - @iRajLalDesigning Killer Apps for Mobile Devices ModevUX May 9 2013 mclean VA - @iRajLal
Designing Killer Apps for Mobile Devices ModevUX May 9 2013 mclean VA - @iRajLal
 
Html5 Whats around the bend
Html5 Whats around the bendHtml5 Whats around the bend
Html5 Whats around the bend
 
Accessible design with html5 JS Everywhere 2012 Oct 26 Fairmont Hotel San Jos...
Accessible design with html5 JS Everywhere 2012 Oct 26 Fairmont Hotel San Jos...Accessible design with html5 JS Everywhere 2012 Oct 26 Fairmont Hotel San Jos...
Accessible design with html5 JS Everywhere 2012 Oct 26 Fairmont Hotel San Jos...
 
Accessibility on Windows Phone - Windows Phone Meetup at Nokia - 16 October @...
Accessibility on Windows Phone - Windows Phone Meetup at Nokia - 16 October @...Accessibility on Windows Phone - Windows Phone Meetup at Nokia - 16 October @...
Accessibility on Windows Phone - Windows Phone Meetup at Nokia - 16 October @...
 
Accessible design - HOW Interactive Design Conference Washington DC SEPT 27-2...
Accessible design - HOW Interactive Design Conference Washington DC SEPT 27-2...Accessible design - HOW Interactive Design Conference Washington DC SEPT 27-2...
Accessible design - HOW Interactive Design Conference Washington DC SEPT 27-2...
 
Accessible Design with HTML5 - HTML5DevConf.com May 21st San Francisco, 2012 ...
Accessible Design with HTML5 - HTML5DevConf.com May 21st San Francisco, 2012 ...Accessible Design with HTML5 - HTML5DevConf.com May 21st San Francisco, 2012 ...
Accessible Design with HTML5 - HTML5DevConf.com May 21st San Francisco, 2012 ...
 
Developing Apps for Nokia Windows Phone VSLiv Conference May 15, 2012 @iRajLal
Developing Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLalDeveloping Apps for Nokia Windows Phone  VSLiv Conference May 15, 2012 @iRajLal
Developing Apps for Nokia Windows Phone VSLiv Conference May 15, 2012 @iRajLal
 
Upgrade Your Website to HTML5 - VSLive Conference New York @iRajLal
Upgrade Your Website to HTML5 - VSLive Conference New York  @iRajLalUpgrade Your Website to HTML5 - VSLive Conference New York  @iRajLal
Upgrade Your Website to HTML5 - VSLive Conference New York @iRajLal
 
Fun with silverlight4 Table of Content @iRajLal
Fun with silverlight4 Table of Content @iRajLalFun with silverlight4 Table of Content @iRajLal
Fun with silverlight4 Table of Content @iRajLal
 
Honeycomb User Interface Design @iRajLal
Honeycomb User Interface Design @iRajLalHoneycomb User Interface Design @iRajLal
Honeycomb User Interface Design @iRajLal
 
Two thumbs User Interface @iRajLal
Two thumbs User Interface @iRajLalTwo thumbs User Interface @iRajLal
Two thumbs User Interface @iRajLal
 
Angry Developer: Creating a Game in QML and JavaScript for MeeGo N9 @iRajLal
Angry Developer: Creating a Game in QML and JavaScript for MeeGo N9 @iRajLalAngry Developer: Creating a Game in QML and JavaScript for MeeGo N9 @iRajLal
Angry Developer: Creating a Game in QML and JavaScript for MeeGo N9 @iRajLal
 
Fun with QML and JavaScript: Embedded Linux Conference 11th April 2011, Hotel...
Fun with QML and JavaScript: Embedded Linux Conference 11th April 2011, Hotel...Fun with QML and JavaScript: Embedded Linux Conference 11th April 2011, Hotel...
Fun with QML and JavaScript: Embedded Linux Conference 11th April 2011, Hotel...
 
Build Cutting edge Mobile Apps using QML and JavaScript for MeeGo N9: Linux F...
Build Cutting edge Mobile Apps using QML and JavaScript for MeeGo N9: Linux F...Build Cutting edge Mobile Apps using QML and JavaScript for MeeGo N9: Linux F...
Build Cutting edge Mobile Apps using QML and JavaScript for MeeGo N9: Linux F...
 

Último

08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking MenDelhi Call girls
 
Google AI Hackathon: LLM based Evaluator for RAG
Google AI Hackathon: LLM based Evaluator for RAGGoogle AI Hackathon: LLM based Evaluator for RAG
Google AI Hackathon: LLM based Evaluator for RAGSujit Pal
 
Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slidespraypatel2
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonetsnaman860154
 
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Igalia
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfEnterprise Knowledge
 
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024BookNet Canada
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerThousandEyes
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Miguel Araújo
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024The Digital Insurer
 
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...shyamraj55
 
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure serviceWhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure servicePooja Nehwal
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking MenDelhi Call girls
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘RTylerCroy
 
Maximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxMaximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxOnBoard
 
SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024Scott Keck-Warren
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsEnterprise Knowledge
 
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesUnblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesSinan KOZAK
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Servicegiselly40
 
Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)Allon Mureinik
 

Último (20)

08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men08448380779 Call Girls In Friends Colony Women Seeking Men
08448380779 Call Girls In Friends Colony Women Seeking Men
 
Google AI Hackathon: LLM based Evaluator for RAG
Google AI Hackathon: LLM based Evaluator for RAGGoogle AI Hackathon: LLM based Evaluator for RAG
Google AI Hackathon: LLM based Evaluator for RAG
 
Slack Application Development 101 Slides
Slack Application Development 101 SlidesSlack Application Development 101 Slides
Slack Application Development 101 Slides
 
How to convert PDF to text with Nanonets
How to convert PDF to text with NanonetsHow to convert PDF to text with Nanonets
How to convert PDF to text with Nanonets
 
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
Raspberry Pi 5: Challenges and Solutions in Bringing up an OpenGL/Vulkan Driv...
 
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdfThe Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
The Role of Taxonomy and Ontology in Semantic Layers - Heather Hedden.pdf
 
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
Transcript: #StandardsGoals for 2024: What’s new for BISAC - Tech Forum 2024
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024Finology Group – Insurtech Innovation Award 2024
Finology Group – Insurtech Innovation Award 2024
 
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
Automating Business Process via MuleSoft Composer | Bangalore MuleSoft Meetup...
 
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure serviceWhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
WhatsApp 9892124323 ✓Call Girls In Kalyan ( Mumbai ) secure service
 
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
08448380779 Call Girls In Diplomatic Enclave Women Seeking Men
 
🐬 The future of MySQL is Postgres 🐘
🐬  The future of MySQL is Postgres   🐘🐬  The future of MySQL is Postgres   🐘
🐬 The future of MySQL is Postgres 🐘
 
Maximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptxMaximizing Board Effectiveness 2024 Webinar.pptx
Maximizing Board Effectiveness 2024 Webinar.pptx
 
SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024SQL Database Design For Developers at php[tek] 2024
SQL Database Design For Developers at php[tek] 2024
 
IAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI SolutionsIAC 2024 - IA Fast Track to Search Focused AI Solutions
IAC 2024 - IA Fast Track to Search Focused AI Solutions
 
Unblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen FramesUnblocking The Main Thread Solving ANRs and Frozen Frames
Unblocking The Main Thread Solving ANRs and Frozen Frames
 
CNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of ServiceCNv6 Instructor Chapter 6 Quality of Service
CNv6 Instructor Chapter 6 Quality of Service
 
Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)Injustice - Developers Among Us (SciFiDevCon 2024)
Injustice - Developers Among Us (SciFiDevCon 2024)
 

Performance Tips & Tricks for QT/QML Apps: MeeGo Conference San Francisco, Hyatt Regency, May 23-25,2011 @iRajLal

  • 1. Performance Tips & Tricks for Qt-QML Apps Rajesh Lal, Nokia
  • 2. High Performance QML Applications + = Qt Quick QML MeeGo Apps Qt UI Creation Kit Most Advanced UI High Performance 2
  • 3. Agenda QML Qt Quick 7 Tips Tools App 3
  • 4. What is Qt Quick • QML • IDE – Qt Creator • Qt UI Designer • Plugin for Mobility API • Quick Components The Fastest way to develop for MeeGo 4
  • 5. What is QML • Qt Meta-Object Language • JavaScript based • Qt Declarative runtime • CSS-JavaScript like syntax The Most Advanced UI technology for Mobile 5
  • 6. QML Powerful Declarative User Interface language 6
  • 7. QML Elements Graphics Animation Binding Items State Property Shapes Transitions JavaScript Text Transform. C++ 7
  • 8. What is a Qt QML App Logic in JavaScript or UI in QML C++ API calls (main.qml) A Qt Container (main.cpp) Qt Quick Application 8
  • 9. Qt-QML App QML App. Viewer Property Bind 1+ QML Files JavaScript Import libraries Logic C++ Binding Import JS files UI 1 | 2 | 3 Qt Container(main.cpp) 9
  • 10. What is Performance • Short response time • High Throughput • Low utilization of resources • High availability • High Speed • Instant • Smoothness 10
  • 11. 7 Tips for High Performance QML Application 11
  • 12. Tip 1 Divide and Rule 12
  • 13. 1: Divide and Rule • Divide application UI into multiple QML files • Each Logical entity as a separate QML file • Think Object Oriented Programming • Do not use 1 Large QML file 13
  • 14. 1: Divide and Rule Rule • Use main.qml as the main UI ₋ With different States & Transitions ₋ Create Multiple Views .QML files ₋ Import folders containing other QML files ₋ Local instances of imported QML elements 14
  • 15. 1: Divide and Rule 15
  • 16. Tip 2 Load and Unload 16
  • 17. 2: Load and Unload • Use Loader to control the memory usage • Load the absolute Minimum at the startup • Dynamically Load and Unload UI Components • Create Components when required 17
  • 18. 2: Load and Unload 18
  • 19. Tip 3 Use Asynchronous Threads 19
  • 20. 3: Asynchronous Threads • Use WorkerScripts for Remote API Calls • Use Threads for time consuming operations • Load large images asynchronously • Use caching for remote data/image (cacheBuffer in listview/Gridview) 20
  • 21. 3: Asynchronous Threads Login call in MyApp.QML MyAppScript/Login.QML file 21
  • 23. Tip 4 Optimize for Images (Greatest User of Memory) 23
  • 24. 4: Optimize for Images • Optimize Images to reduce memory footprints • Specify exact size of the image • Avoid resizing/scaling an image in QML • Lazy load large images (asynchronous=true) • Don’t cache large images (cache=false) • Smooth filter = better visual quality, but slower 24
  • 25. Tip 5 Beware of String Operations 25
  • 26. 5: Beware of String Operations • Strings are immutable • multiple '+' operator = multiple memory allocations • Use StringBuilder for more efficient strings • Define ₋ #define QT_USE_FAST_CONCATENATION ₋ #define QT_USE_FAST_OPERATOR_PLUS 26
  • 27. Tip 6 Know States, Transitions, & Animations 27
  • 28. 6: Know States, Transitions, & Animations • In transition, animated area should be small • Animate different items sequentially when possible • Avoid multiple timers during animation • Avoid JavaScript operations during animation • Use ScriptAction & StateChangeScript 28
  • 29. Tip 7 Follow Best Practices 29
  • 30. 7: Best Practices • For best performance use C++ instead of JavaScript • Insert properties at top of element declarations • Create application logic outside QML • Don’t build multiple layer of QML hierarchies • Use Qt's i18n for internationalisation & localisation 30
  • 31. Tools QML Performance Monitor http://www.youtube.com/watch?v=XdI9C53uJw8 Valgrind http://valgrind.org/docs/manual/mc-manual.html QML Performance Guidelines http://doc.qt.nokia.com/4.7/qdeclarativeperformance.html 31