[UI5con 2020 - Belgium] Boost your UI5 apps with server side rendering
Download as PPTX, PDF2 likes149 views
The document discusses server-side rendering (SSR) for UI5 applications, highlighting its benefits for search engine optimization and static content delivery. It contrasts SSR with client-side rendering, offering advice on when to use each based on application needs. Additionally, it includes performance metrics and contact information for the authors, Nitish Mehta and Vaibhav Arora.
[UI5con 2020 - Belgium] Boost your UI5 apps with server side rendering
- 1. Nitish Mehta, INTEGRTR Vaibhav Arora , Klarna February 14, 2020 Boost your UI5 apps with Server-side rendering
- 2. 2 Software developer passionate about web and performance. Former SAP UI5 developer, openUI5 contributor and currently developing FinTech solutions at Klarna in Stockholm. Vaibhav Arora vaibhavar03@gmail.com https://www.linkedin.com/in/vaibhavar/ https://twitter.com/theVaibhavArora
- 3. 3 Ex-SAP | Entrepreneur | Tech & Travel enthusiast Founder & CEO, CloudIntegrtr Software Service Pvt Ltd (INTEGRTR) Nitish Mehta nitish.mehta@integrtr.com https://www.linkedin.com/in/nitishmehta08 https://twitter.com/nitish_mehta An enterprise-tech startup simplifying integrations and assisting medium & large enterprises in their digital transformation journey.
- 4. An introduction to server-side rendering
- 5. John's Pizza Place • Order my favourite pizza • Mr. John comes up to my table • But wait... • Hungry Hangry • Mr. John prepares the pizza on my table
- 6. Pizza on client side Empty Plate Ingredients (CSS/JS/Images/other resources)
- 7. Pizza Place – ServerSide ️ • Order my favourite pizza • Mr. John comes up to my table • EAT PIZZA ! ️
- 8. When to prefer server-side rendering ?
- 9. When to prefer server-side rendering ? Content is the king in your app (Search engine optimization is important) Your app serves mostly static pages
- 10. When NOT to go for server-side rendering ?
- 11. When NOT to go for server-side rendering ? Your app serves real time data that changes Perceived load time is not a big problem for your app
- 13. ️ ️ Chrome as Node Library Controllable via node API Run headless
- 14. Node App to serve UI5 #/home Barebone HTML JS resources CSS resources data
- 15. Node App to serve UI5 UI5 App rendered on puppeteer /server-side/home Rendered HTML
- 16. Show me the code !
- 17. 17 Largest Contentful Paint (Client side) 2.59 seconds
- 18. 18 Largest Contentful Paint (Server side) 1.12 seconds
- 19. 19 It is not battle tested.... yet! openUI5 Community
- 20. Thank you. Nitish Mehta ( INTEGRTR ) nitish.mehta@integrtr.com https://www.linkedin.com/in/nitishmehta08 https://twitter.com/nitish_mehta Vaibhav Arora ( Klarna ) vaibhavar03@gmail.com https://www.linkedin.com/in/vaibhavar/ https://twitter.com/theVaibhavArora Contact information:
Editor's Notes
- #13: Ui5 webcomponents – react
- #14: - node library by Google that lets you create chromium instances in node environment - you get an API where you can control the browser - can runs headless chrome – does not need a UI
- #20: More improvements & a npm library to come – will be shared on linkedIn/twitter