The document summarizes new trends on the web platform that are making the mobile web experience more like native apps. It discusses how progressive web apps (PWAs) can offer reliable, fast and engaging experiences through features like service workers, web app manifests, and push notifications. PWAs provide low friction access to content through features like add to home screen and deep linking, while remaining lightweight and not requiring app installation. The document outlines the evolution of the web platform and browser capabilities that now enable high-quality app-like experiences through progressive enhancement using new standards and APIs.
Progressive Web Apps use modern web capabilities to deliver an app-like user experience. They evolve from pages in browser tabs to immersive, top-level apps, maintaining the web's low friction at every moment.
They are reliable, fast, engaging and delivering amazing UX to end users. And they are here!
The slides are from my talk at http://2018.symfonycamp.org.ua/
Progressive Web App (PWA) is a term used to denote web apps that use the latest web technologies. Progressive web apps are technically regular web pages (or websites) but can appear to the user like traditional applications or (native) mobile applications. This new application type attempts to combine features offered by most modern browsers with the benefits of mobile experience.
Progressive Web Apps - presence or the future? For years, developers around the world have dreamed of being able to write web applications which act more like native apps. Caching and push notifications are not the only conveniences helping to make this dream a reality. In this talk, Jana will explain what Progressive Web Apps are and how you can use them in your own web applications.
Progressive Web Apps use modern web capabilities to deliver an app-like user experience. They evolve from pages in browser tabs to immersive, top-level apps, maintaining the web's low friction at every moment.
They are reliable, fast, engaging and delivering amazing UX to end users. And they are here!
The slides are from my talk at http://2018.symfonycamp.org.ua/
Progressive Web App (PWA) is a term used to denote web apps that use the latest web technologies. Progressive web apps are technically regular web pages (or websites) but can appear to the user like traditional applications or (native) mobile applications. This new application type attempts to combine features offered by most modern browsers with the benefits of mobile experience.
Progressive Web Apps - presence or the future? For years, developers around the world have dreamed of being able to write web applications which act more like native apps. Caching and push notifications are not the only conveniences helping to make this dream a reality. In this talk, Jana will explain what Progressive Web Apps are and how you can use them in your own web applications.
“Progressive Web Apps (PWAs) are web applications that load like regular web pages or websites but can offer the user functionality such as working offline, push notifications, and device hardware access traditionally available only to native mobile applications. PWAs are an emerging technology that combine the open standards of the web offered by modern browsers to provide benefits of a rich mobile experience”
This slide is from the talk that i have given in DevFest at GDG Jalandhar & DSC Workshops.it Contains all the basic features,code and tools required to build a Progressive web apps.
Progressive Web Apps, also known as Installable Web Apps or Hybrid Web Apps, is the latest industry trend helping businesses create more engaged and loyal customers by presenting regular web pages or websites as traditional applications or native mobile applications to the users.
What are the ways that startups can leverage the benefits that progressive web apps allow these days?
In this talk, I covered some of the startups best practices and how entrepreneurs can take advantage from the capabilities that PWAs give them.
Progressive Web App (PWA) is a term used to denote web apps that use the latest web technologies. Progressive web apps are technically regular web pages (or websites) but can appear to the user like traditional applications or (native) mobile applications. This new application type attempts to combine features offered by most modern browsers with the benefits of mobile experience.
Progressive Web Apps - Overview & Getting StartedGaurav Behere
A brief intro to progressive web apps & conventional ways of performance optimization on web.
The presentation was given as part of a tech talk, thus the readers are suggested to read through the reference links as well.
This Slide Deck Was used on my Masterclass abut PWA in my Masterclass about PWA and Web Standards. Thia was an introduction to PWA and his basic stone Path.
Progressive Web Apps and the Windows Ecosystem [Build 2017]Aaron Gustafson
Whether at home or at work, the web plays an increasingly critical role in our daily lives. As we have become more dependent on accessing the tools it powers, we’ve also struggled to overcome some of its limitations—network connectivity, for instance. At Microsoft, we’ve long been interested in the power of the web for software development and we are even more excited for the future possibilities offered by progressive web apps (PWAs). In this session, we discuss what PWAs are, how they can be integrated into the development process of modern websites, the advantages and disadvantages of PWAs vs. native development, and what opportunities they present when installed alongside native apps in Windows.
About a year ago, we started using Progressive Web Apps (PWAs). The idea behind PWA was to replace native mobile apps. In this talk, I will show you what is possible to build with PWA, what kind of limitations exist, and what we learned in our journey. Along the way, you will see where progressive web apps can be a good fit for your own projects.
The Web has grown from sharing information as document to highly scalable application. With the introduction of Progressive web apps, we now have a whole new way to rethink and architect client applications across multiple platforms. The primary motive of a PWA is for it feel like a native app irrespective of the platform.
“Progressive Web Apps (PWAs) are web applications that load like regular web pages or websites but can offer the user functionality such as working offline, push notifications, and device hardware access traditionally available only to native mobile applications. PWAs are an emerging technology that combine the open standards of the web offered by modern browsers to provide benefits of a rich mobile experience”
This slide is from the talk that i have given in DevFest at GDG Jalandhar & DSC Workshops.it Contains all the basic features,code and tools required to build a Progressive web apps.
Progressive Web Apps, also known as Installable Web Apps or Hybrid Web Apps, is the latest industry trend helping businesses create more engaged and loyal customers by presenting regular web pages or websites as traditional applications or native mobile applications to the users.
What are the ways that startups can leverage the benefits that progressive web apps allow these days?
In this talk, I covered some of the startups best practices and how entrepreneurs can take advantage from the capabilities that PWAs give them.
Progressive Web App (PWA) is a term used to denote web apps that use the latest web technologies. Progressive web apps are technically regular web pages (or websites) but can appear to the user like traditional applications or (native) mobile applications. This new application type attempts to combine features offered by most modern browsers with the benefits of mobile experience.
Progressive Web Apps - Overview & Getting StartedGaurav Behere
A brief intro to progressive web apps & conventional ways of performance optimization on web.
The presentation was given as part of a tech talk, thus the readers are suggested to read through the reference links as well.
This Slide Deck Was used on my Masterclass abut PWA in my Masterclass about PWA and Web Standards. Thia was an introduction to PWA and his basic stone Path.
Progressive Web Apps and the Windows Ecosystem [Build 2017]Aaron Gustafson
Whether at home or at work, the web plays an increasingly critical role in our daily lives. As we have become more dependent on accessing the tools it powers, we’ve also struggled to overcome some of its limitations—network connectivity, for instance. At Microsoft, we’ve long been interested in the power of the web for software development and we are even more excited for the future possibilities offered by progressive web apps (PWAs). In this session, we discuss what PWAs are, how they can be integrated into the development process of modern websites, the advantages and disadvantages of PWAs vs. native development, and what opportunities they present when installed alongside native apps in Windows.
About a year ago, we started using Progressive Web Apps (PWAs). The idea behind PWA was to replace native mobile apps. In this talk, I will show you what is possible to build with PWA, what kind of limitations exist, and what we learned in our journey. Along the way, you will see where progressive web apps can be a good fit for your own projects.
The Web has grown from sharing information as document to highly scalable application. With the introduction of Progressive web apps, we now have a whole new way to rethink and architect client applications across multiple platforms. The primary motive of a PWA is for it feel like a native app irrespective of the platform.
What are the principles to build a progressive web app? What are its core features? What about its architecture? The blog explores it all. Give it a read. https://www.webguru-india.com/blog/checklist-for-progressive-web-app-development/
Presented at Web Directions Code, Melbourne
If you have a website—particularly one that generates revenue for your organization—you need a Progressive Web App. So where do you begin? How do you decide which features of a Progressive Web App make sense for your users? What tools can make the process easier (or harder)? In this practical session, Jason will guide you through the key design decisions you’ll need to make about your Progressive Web App and how those decisions impact the scope of your project. He'll also teach you how to avoid common pitfalls and help you take full advantage of Progressive Web App technology.
Why Progressive Web App is what you need for your BusinessLets Grow Business
Progressive web apps can help you build a native app like experience for your business on web. No need to install apps, No pushing to various platform. Just one for all. Here is why you should be excited about PWA.
This slides includes :
- Introduction to progressive web apps
- History of mobile and web applications
- Advantages of creating Progressive Web Apps
- Techniques for developing Progressive Web Apps
- Limitations of creating Progressive Web Apps
Go for Progressive Web Apps. Get a Better, Low Cost, Mobile PresenceMagic Software
Progressive web app may look like a buzz word around improved web standards and few mobile friendly web design patterns. But it brings positive impact on businesses and users. Let’s learn more about it here.
Progressive Web App
New Web Technology for the Mobile User Which work on Poor Data Connection and It Will Work With Simple Manifest File Or with use of Service Workers. It Feel Like Mobile App to the user.
Progressive Web Applications are a new way to think about using the web to provide great user experiences using the best web platform features.
The education market has many opportunities to benefit their communities using PWAs to deliver information and application experiences across all devices and platforms.
A progressive web application is a type of application software delivered through the web, built using common web technologies including HTML, CSS and JavaScript. It is intended to work on any platform that uses a standards-compliant browser.
Introduction to Progressive Web Apps (PWA) as presented in Divum's New Product Developers Meet. PWA provides highly reliable, fast & engaged mobile like user experience on the web.
Core Web Vitals SEO Workshop - improve your performance [pdf]Peter Mead
Core Web Vitals to improve your website performance for better SEO results with CWV.
CWV Topics include:
- Understanding the latest Core Web Vitals including the significance of LCP, INP and CLS + their impact on SEO
- Optimisation techniques from our experts on how to improve your CWV on platforms like WordPress and WP Engine
- The impact of user experience and SEO
The improvements in size, features and price of hardware has ushered new opportunities in creating small, smart devices (aka internet-of-things) which can be integrated in homes and industries. In these places, the devices can help automate common tasks, as well as give information about the state of things, such as temperature of a machine, air quality etc.
Installing an app for one such devices might seem fine at first, but it doesn’t scale nicely to 100s of devices, or devices you seldom interact with, like in an industrial setting. Devices might even have different security restrictions, like being locked behind a physical key.
So how do we communicate with these devices? The web has always been known for its low fraction and easy onboarding. No need to install any software, just type in a URL and off you go. And it has always been very secure with its sandbox system, and companies can even have URLs be restricted to certain WiFi networks (intranet).
In the last couple of years, the web has taken a quantum leap in usability, with offline support, and many ways to make the experience very app-like. So the question is unavoidable, can the web be the platform to make smart devices succeed?
The web lives in a sandbox, and its security model has allowed people to trust it and for it to grow enormously over time, but the world is changing around us. There is a growing need to access new hardware capabilities such as sensors or just connect to devices around us.
The great news is that the web sandbox is growing with new capabilities and with new security models, allowing us to connect to devices via Bluetooth, USB or even talk NFC. There are now even ways to directly get magnetometer readings on Android devices.
In this talk we will look at this new landscape and how it enables the new wave of smart devices. We will also look at how easy it is to use some of these new APIs.
Come join me for a look at how the web can make your smart devices success
A mini intro to web components, starting from what you (presumable) already know and slowly adopting new vanilla web components features. After that, is shows how to accomplish the same using Polymer 2.0.
Intended to be instructor led.
WebKit is everywhere, on desktops, mobiles, - and as an integrated part of the Qt platform, it is on Linux-based MeeGo as well.
n this session we will quickly introduce the WebKit project, and look at why it has become so popular on the mobile platform. We will look at some of the mobile adaptions normally done by the different WebKit ports and at the work we have been doing in Qt WebKit to make it more fit for mobile usage.
Some of the technologies we will touch, includes: frame flattening, tiling (including challenges), viewport meta information, touch events and fuzzy hit testing.
We hope the session will make people aware of the importance of the Qt WebKit project and its mobile efforts; create discussions and use-cases that we can use for integrating even better with, in particular, open source projects targeting mobile usage and the open source community in general.
The Art of the Pitch: WordPress Relationships and SalesLaura Byrne
Clients don’t know what they don’t know. What web solutions are right for them? How does WordPress come into the picture? How do you make sure you understand scope and timeline? What do you do if sometime changes?
All these questions and more will be explored as we talk about matching clients’ needs with what your agency offers without pulling teeth or pulling your hair out. Practical tips, and strategies for successful relationship building that leads to closing the deal.
Threats to mobile devices are more prevalent and increasing in scope and complexity. Users of mobile devices desire to take full advantage of the features
available on those devices, but many of the features provide convenience and capability but sacrifice security. This best practices guide outlines steps the users can take to better protect personal devices and information.
Sudheer Mechineni, Head of Application Frameworks, Standard Chartered Bank
Discover how Standard Chartered Bank harnessed the power of Neo4j to transform complex data access challenges into a dynamic, scalable graph database solution. This keynote will cover their journey from initial adoption to deploying a fully automated, enterprise-grade causal cluster, highlighting key strategies for modelling organisational changes and ensuring robust disaster recovery. Learn how these innovations have not only enhanced Standard Chartered Bank’s data infrastructure but also positioned them as pioneers in the banking sector’s adoption of graph technology.
In the rapidly evolving landscape of technologies, XML continues to play a vital role in structuring, storing, and transporting data across diverse systems. The recent advancements in artificial intelligence (AI) present new methodologies for enhancing XML development workflows, introducing efficiency, automation, and intelligent capabilities. This presentation will outline the scope and perspective of utilizing AI in XML development. The potential benefits and the possible pitfalls will be highlighted, providing a balanced view of the subject.
We will explore the capabilities of AI in understanding XML markup languages and autonomously creating structured XML content. Additionally, we will examine the capacity of AI to enrich plain text with appropriate XML markup. Practical examples and methodological guidelines will be provided to elucidate how AI can be effectively prompted to interpret and generate accurate XML markup.
Further emphasis will be placed on the role of AI in developing XSLT, or schemas such as XSD and Schematron. We will address the techniques and strategies adopted to create prompts for generating code, explaining code, or refactoring the code, and the results achieved.
The discussion will extend to how AI can be used to transform XML content. In particular, the focus will be on the use of AI XPath extension functions in XSLT, Schematron, Schematron Quick Fixes, or for XML content refactoring.
The presentation aims to deliver a comprehensive overview of AI usage in XML development, providing attendees with the necessary knowledge to make informed decisions. Whether you’re at the early stages of adopting AI or considering integrating it in advanced XML development, this presentation will cover all levels of expertise.
By highlighting the potential advantages and challenges of integrating AI with XML development tools and languages, the presentation seeks to inspire thoughtful conversation around the future of XML development. We’ll not only delve into the technical aspects of AI-powered XML development but also discuss practical implications and possible future directions.
A tale of scale & speed: How the US Navy is enabling software delivery from l...sonjaschweigert1
Rapid and secure feature delivery is a goal across every application team and every branch of the DoD. The Navy’s DevSecOps platform, Party Barge, has achieved:
- Reduction in onboarding time from 5 weeks to 1 day
- Improved developer experience and productivity through actionable findings and reduction of false positives
- Maintenance of superior security standards and inherent policy enforcement with Authorization to Operate (ATO)
Development teams can ship efficiently and ensure applications are cyber ready for Navy Authorizing Officials (AOs). In this webinar, Sigma Defense and Anchore will give attendees a look behind the scenes and demo secure pipeline automation and security artifacts that speed up application ATO and time to production.
We will cover:
- How to remove silos in DevSecOps
- How to build efficient development pipeline roles and component templates
- How to deliver security artifacts that matter for ATO’s (SBOMs, vulnerability reports, and policy evidence)
- How to streamline operations with automated policy checks on container images
UiPath Test Automation using UiPath Test Suite series, part 5DianaGray10
Welcome to UiPath Test Automation using UiPath Test Suite series part 5. In this session, we will cover CI/CD with devops.
Topics covered:
CI/CD with in UiPath
End-to-end overview of CI/CD pipeline with Azure devops
Speaker:
Lyndsey Byblow, Test Suite Sales Engineer @ UiPath, Inc.
Unlocking Productivity: Leveraging the Potential of Copilot in Microsoft 365, a presentation by Christoforos Vlachos, Senior Solutions Manager – Modern Workplace, Uni Systems
Essentials of Automations: The Art of Triggers and Actions in FMESafe Software
In this second installment of our Essentials of Automations webinar series, we’ll explore the landscape of triggers and actions, guiding you through the nuances of authoring and adapting workspaces for seamless automations. Gain an understanding of the full spectrum of triggers and actions available in FME, empowering you to enhance your workspaces for efficient automation.
We’ll kick things off by showcasing the most commonly used event-based triggers, introducing you to various automation workflows like manual triggers, schedules, directory watchers, and more. Plus, see how these elements play out in real scenarios.
Whether you’re tweaking your current setup or building from the ground up, this session will arm you with the tools and insights needed to transform your FME usage into a powerhouse of productivity. Join us to discover effective strategies that simplify complex processes, enhancing your productivity and transforming your data management practices with FME. Let’s turn complexity into clarity and make your workspaces work wonders!
Climate Impact of Software Testing at Nordic Testing DaysKari Kakkonen
My slides at Nordic Testing Days 6.6.2024
Climate impact / sustainability of software testing discussed on the talk. ICT and testing must carry their part of global responsibility to help with the climat warming. We can minimize the carbon footprint but we can also have a carbon handprint, a positive impact on the climate. Quality characteristics can be added with sustainability, and then measured continuously. Test environments can be used less, and in smaller scale and on demand. Test techniques can be used in optimizing or minimizing number of tests. Test automation can be used to speed up testing.
UiPath Test Automation using UiPath Test Suite series, part 6DianaGray10
Welcome to UiPath Test Automation using UiPath Test Suite series part 6. In this session, we will cover Test Automation with generative AI and Open AI.
UiPath Test Automation with generative AI and Open AI webinar offers an in-depth exploration of leveraging cutting-edge technologies for test automation within the UiPath platform. Attendees will delve into the integration of generative AI, a test automation solution, with Open AI advanced natural language processing capabilities.
Throughout the session, participants will discover how this synergy empowers testers to automate repetitive tasks, enhance testing accuracy, and expedite the software testing life cycle. Topics covered include the seamless integration process, practical use cases, and the benefits of harnessing AI-driven automation for UiPath testing initiatives. By attending this webinar, testers, and automation professionals can gain valuable insights into harnessing the power of AI to optimize their test automation workflows within the UiPath ecosystem, ultimately driving efficiency and quality in software development processes.
What will you get from this session?
1. Insights into integrating generative AI.
2. Understanding how this integration enhances test automation within the UiPath platform
3. Practical demonstrations
4. Exploration of real-world use cases illustrating the benefits of AI-driven test automation for UiPath
Topics covered:
What is generative AI
Test Automation with generative AI and Open AI.
UiPath integration with generative AI
Speaker:
Deepak Rai, Automation Practice Lead, Boundaryless Group and UiPath MVP
GraphSummit Singapore | The Future of Agility: Supercharging Digital Transfor...Neo4j
Leonard Jayamohan, Partner & Generative AI Lead, Deloitte
This keynote will reveal how Deloitte leverages Neo4j’s graph power for groundbreaking digital twin solutions, achieving a staggering 100x performance boost. Discover the essential role knowledge graphs play in successful generative AI implementations. Plus, get an exclusive look at an innovative Neo4j + Generative AI solution Deloitte is developing in-house.
GraphRAG is All You need? LLM & Knowledge GraphGuy Korland
Guy Korland, CEO and Co-founder of FalkorDB, will review two articles on the integration of language models with knowledge graphs.
1. Unifying Large Language Models and Knowledge Graphs: A Roadmap.
https://arxiv.org/abs/2306.08302
2. Microsoft Research's GraphRAG paper and a review paper on various uses of knowledge graphs:
https://www.microsoft.com/en-us/research/blog/graphrag-unlocking-llm-discovery-on-narrative-private-data/
Observability Concepts EVERY Developer Should Know -- DeveloperWeek Europe.pdfPaige Cruz
Monitoring and observability aren’t traditionally found in software curriculums and many of us cobble this knowledge together from whatever vendor or ecosystem we were first introduced to and whatever is a part of your current company’s observability stack.
While the dev and ops silo continues to crumble….many organizations still relegate monitoring & observability as the purview of ops, infra and SRE teams. This is a mistake - achieving a highly observable system requires collaboration up and down the stack.
I, a former op, would like to extend an invitation to all application developers to join the observability party will share these foundational concepts to build on:
Generative AI Deep Dive: Advancing from Proof of Concept to ProductionAggregage
Join Maher Hanafi, VP of Engineering at Betterworks, in this new session where he'll share a practical framework to transform Gen AI prototypes into impactful products! He'll delve into the complexities of data collection and management, model selection and optimization, and ensuring security, scalability, and responsible use.
Removing Uninteresting Bytes in Software FuzzingAftab Hussain
Imagine a world where software fuzzing, the process of mutating bytes in test seeds to uncover hidden and erroneous program behaviors, becomes faster and more effective. A lot depends on the initial seeds, which can significantly dictate the trajectory of a fuzzing campaign, particularly in terms of how long it takes to uncover interesting behaviour in your code. We introduce DIAR, a technique designed to speedup fuzzing campaigns by pinpointing and eliminating those uninteresting bytes in the seeds. Picture this: instead of wasting valuable resources on meaningless mutations in large, bloated seeds, DIAR removes the unnecessary bytes, streamlining the entire process.
In this work, we equipped AFL, a popular fuzzer, with DIAR and examined two critical Linux libraries -- Libxml's xmllint, a tool for parsing xml documents, and Binutil's readelf, an essential debugging and security analysis command-line tool used to display detailed information about ELF (Executable and Linkable Format). Our preliminary results show that AFL+DIAR does not only discover new paths more quickly but also achieves higher coverage overall. This work thus showcases how starting with lean and optimized seeds can lead to faster, more comprehensive fuzzing campaigns -- and DIAR helps you find such seeds.
- These are slides of the talk given at IEEE International Conference on Software Testing Verification and Validation Workshop, ICSTW 2022.
GDG Cloud Southlake #33: Boule & Rebala: Effective AppSec in SDLC using Deplo...James Anderson
Effective Application Security in Software Delivery lifecycle using Deployment Firewall and DBOM
The modern software delivery process (or the CI/CD process) includes many tools, distributed teams, open-source code, and cloud platforms. Constant focus on speed to release software to market, along with the traditional slow and manual security checks has caused gaps in continuous security as an important piece in the software supply chain. Today organizations feel more susceptible to external and internal cyber threats due to the vast attack surface in their applications supply chain and the lack of end-to-end governance and risk management.
The software team must secure its software delivery process to avoid vulnerability and security breaches. This needs to be achieved with existing tool chains and without extensive rework of the delivery processes. This talk will present strategies and techniques for providing visibility into the true risk of the existing vulnerabilities, preventing the introduction of security issues in the software, resolving vulnerabilities in production environments quickly, and capturing the deployment bill of materials (DBOM).
Speakers:
Bob Boule
Robert Boule is a technology enthusiast with PASSION for technology and making things work along with a knack for helping others understand how things work. He comes with around 20 years of solution engineering experience in application security, software continuous delivery, and SaaS platforms. He is known for his dynamic presentations in CI/CD and application security integrated in software delivery lifecycle.
Gopinath Rebala
Gopinath Rebala is the CTO of OpsMx, where he has overall responsibility for the machine learning and data processing architectures for Secure Software Delivery. Gopi also has a strong connection with our customers, leading design and architecture for strategic implementations. Gopi is a frequent speaker and well-known leader in continuous delivery and integrating security into software delivery.
Maruthi Prithivirajan, Head of ASEAN & IN Solution Architecture, Neo4j
Get an inside look at the latest Neo4j innovations that enable relationship-driven intelligence at scale. Learn more about the newest cloud integrations and product enhancements that make Neo4j an essential choice for developers building apps with interconnected data and generative AI.
10. But mobile is a different beast than the desktop
➫ Unreliable network
➫ Slower hardware
➫ Less screen real-estate
➫ Different input methods
➫ Different set of expectations
11. And for a long time...
Great sadness
Lots of dinosaurs, slowness, hard to re-engage with
users, hard to pay on mobile
...really a
second grade experience
Source: funnycatsite.com
15. The mobile landscape changed
a lot in recent years
But we need to keep in mind that
16. ➫ People don't proactively look for new apps to install
➫ On average, a user in the US installs 0 new apps per month
➫ People hate to get updates for apps they don't use
Mobile evolved
17. I don't want to download your app,
I just want to do stuff
23. We want low friction and engaging,
easy to use experiences
24. ➫ Low friction with a continuous focus on time to interactive
➫ Great performance with browser optimizations and good
developer primitives
➫ Reliability with new APIs allowing apps to work offline
➫ Easy distribution as you can link even to sub sites (say a
specific tweet on Twitter)
The web on mobile can offer
25. ➫ Engaging and allow to re-engage with users with push
messages or by placing an icon right on the user home
screen
➫ Ephemeral by only updating app resources when accessing
it and remove least used resources
The web on mobile can be
26. Low friction with a continuous focus on time to interactive
➫ Smart code splitting with ECMAScript modules and HTTP 2.0 Push
➫ Service Worker caching
➫ Google's PRPL (Push, Render, Pre-cache, Lazy-load) pattern
➫ Google Lighthouse and Microsoft Sonarwhal
The web evolved
27. Great performance with browser optimizations and good
developer primitives
➫ Lots of browser optimizations all over for touch/rendering etc
➫ CSS contain: strict to avoid doing unnecessary work
➫ Encapsulation and shareability with web components
➫ Classes and better language primitives with ES2015+
The web evolved
28. Reliability with new APIs allowing apps to work offline
➫ Service Workers supply a proxy between the browser and the server
➫ Allows for flexible, programmatically programming
➫ A separate process which only runs when needed
➫ Can run when browser is closed as a result of events
➫ A new primitive for the web (for push etc)
The web evolved
29. Easy distribution as you can link even to sub sites
➫ Apps and sites can be shared with just a link
➫ Deep-linking can be used to share a specific view in the app or state
○ For instance a deep link to a specific tweet on Twitter
○ Ie. https://twitter.com/IntelSoftware/status/930853470952759296
➫ Sites can still be distributed via stores, with proper infra or packaged
The web evolved
30. Engaging and allow to re-engage with users with push
messages or by placing an icon right on the user home screen
➫ Push messages (via Service Worker) allows sites to re-engage with users
➫ Web App Manifest, allows configuring an app-like experience
○ Show no chrome (standalone), lock to portrait, theme-color, start URL etc
○ Add to homescreen experience with icon and integration with host OS
The web evolved
31. Ephemeral by only updating app resources when accessing it
and remove least used resources
➫ Resources (Service Worker cache etc) are updated when site is visited
➫ Caches gets removed when out of space, least used first
➫ Permanent storage can be requested for apps added to homescreen
The web evolved
39. As you interact with a PWA experience, gradually you become
more engaged
➫ PWAs are web sites that progressively becomes more app-like
➫ If you use on a regular basis, you might want app on your homescreen
➫ A browser engagement threshold allows sites prompting to install after a while
➫ No door slammers, no prompt for things you seldom use
➫ User always in control
➫ When launched from homescreen, it can act more like a real app
Progressive Web Apps
43. 76% increase in conversions
+14% iOS
+30% Android
monthly active users
44. 26%increase in average spend
per visit by members arriving
via a push notification
72%increase in time spent for users
visiting via a push notification
+50%repeat visits within 3 months
45. And many, many more...
Checkout https://www.pwastats.com/ and https://developers.google.com/web/showcase/
for more statistics and success stories
52. Service Workers work on second load
➫ Progressive enhancement
➫ Site much work without
➫ Provides an update mechanism
53. Service Workers are flexible!
➫ They are a specialized web worker
➫ Programmable!
➫ Choose your own caching mechanism
➫ Even different one depending on URL!
62. Add to homescreen
Can prompt users to install
Requires* some engagement
*Requirements may change over time
63. Web APK improved experience
➫ Accessible in launcher
➫ Launchable from other apps
➫ Better Android integration
64. Push notifications
System level notifications,
like apps
Ask to notify users with
specific information
Can send notifications even
when page closed
70. Google is a big supporter
➫ Very good support on Android
➫ Working on desktop + Chrome OS support
➫ Working on extending standards and matching Electron
features on desktop
71. PWAs on Android
➫ Requires HTTPS, Offline experience, manifest
➫ Engagement criteria
➫ Add to homescreen dialog
➫ Installs generated Web APK from Google server
72. PWAs in the Play Store?
➫ Not directly supported
➫ New Trusted Web Activity
○ Abide to Play store rules (payment etc)
○ Needs a file on server linking to app to show relationship
○ Runs in Chrome (not WebView) like Custom Tabs
○ Can be extended in Java with a onmessage/postmessage API
75. Microsoft PWA support is strategic
➫ Deeply integrated into Windows
➫ Web Assembly allows native code to run at near native
speed on the web
➫ PWAs in store have access to all WinRT APIs
○ Polyfills will be available for some not-implemented APIs like Web
Bluetooth
81. Server
Request index.html
Receive index.html
Request style.css
Receive style.css
Server
Request index.html
Receive index.html
Receive style.css
Receive app.js
HTTP 2.0 Push
HTTP 1.x HTTP 2.0
➫ Server Push lets the server bundle and send assets alongside a request
➫ This allows the server to do on-demand code splitting/bundling with ES modules
➫ Can reduce load times
➫ Less need to inline CSS, JS…
➫ Better caching in the browser
➫ Pillarstone in PRPL (Push critical resources, Render, Pre-cache, Lazy-load) pattern
1
2
3
4
1
2
BrowserBrowser
82. Seamless Sign-In
New Credential management API* for
seamless sign-in
AliExpress:
- 85% sign-in failure
+ 11% conversion
Pinterest:
+ 10% increase in desktop logins
*https://developers.google.com/web/updates/2016/04/credential-management-api
"Polyfill" depending on Google accounts: https://developers.google.com/identity/
83. Surfing random sites will stay safe
➫ Two new standards: Web Bluetooth and Web USB
➫ Only available from sites served over HTTPS
➫ Only accessible from top frame
➫ User gesture required to actually request and connect to a device
➫ Avoids fingerprinting: Device is selected by user, only that device is exposed
to the particular site
Security focused device access via Bluetooth and USB
84. Web Bluetooth
➫ Bluetooth 4+ (Low Energy) GATT
○ Easy to use, modern web API
○ Uses promises and typed arrays
(ie. Uint8Array etc)
➫ No Classic mode, only Low Energy protocol
➫ Only Central, eg. can connect to peripheral, but
not act like peripherals
86. Puck.js
➫ Program Espruino devices in
JavaScript
➫ Web based IDE running in the
browser
➫ Uses Web Bluetooth for
communication
87. Web USB
➫ Securely access USB devices
connected to your computer
➫ Allows creating devices without the
need of expensive native drivers/sdk
➫ Web first experience possible
Polyfill will be available for
PWAs in the Microsoft Store
90. Zephyr.JS
➫ Program Zephyr RTOS
devices in JavaScript
➫ Web based IDE running in the
browser
➫ Uses Web USB for
communication
➫ Created at Intel Open Source
Technology Center
91. Web Payments
➫ Making paying easy on the mobile
web, avoiding long form checkouts
➫ Use payment methods stored on
your Apple/Android/Samsung Pay
or in your browser
➫ Merchant doesn’t have access to
your payment details
92. Web VR
➫ Bringing Virtual Reality to the Web
➫ Easy to use API to access hardware
capabilities
○ Use WebGL (2) for rendering
○ GamePad support
➫ Progressive enhancement: works
without VR gear
93. Web Assembly
➫ Compile target for lang's used in native apps: C/
C++ / Rust
➫ Kind of an efficient, low-level bytecode for the web
➫ Small, fast to load and efficient to execute
➫ Bring existing libraries and code to the web
➫ Great for high-end games, CAD and professional
video editors
➫ Fast, portable and secure
https://medium.com/google-earth/earth-on-web-the-road-to-
cross-browser-7338e0f46278
95. Classes
class Animal {
constructor(name) {
this.name = name;
}
static eat() {
return this;
}
speak() {
console.log(this.name + ' makes a noise.');
}
}
// Create an instance of Animal
let obj = new Animal();
obj.speak(); // Animal {}
➫ Built on JavaScript's existing
prototype-based inheritance
➫ Support short names
➫ Two inheritance trees (one for
regular and one for static
methods)
➫ Define and support inheritance
with extends keyword
96. Arrow function
function funcName(params) {
return params + 2;
}
funcName(2);
// 4
const funcName = (params) => params + 2
funcName(2);
// 4
➫ More concise syntax
➫ No need to re-bind <this>
function Person(){
this.age = 0;
setInterval(() => {
// |this| refers to the person object
this.age++;
}, 1000);
}
function Person() {
var that = this;
that.age = 0;
setInterval(function growUp() {
that.age++;
}, 1000);
}
97. ES Modules
export function sayName(name) {
console.log(`Hello ${name}`);
}
➫ Separate code into modules
➫ Import and export symbols
➫ Support for sync and async loading
➫ Improves code organization
➫ Great for external dependencies
mymodule.js
import { sayName } from './mymodule.js';
sayName('Sam');
// Hello Sam
app.js