Progressive web application development by example develop fast, reliable and engaging user experiences for the web
Leverage the full potential of the web to make your web sites better than native applications for every platform. Key Features Explore different models and patterns required to develop progressive web applications Create applications requiring shorter runtime for attracting more users Study differen...
Otros Autores: | |
---|---|
Formato: | Libro electrónico |
Idioma: | Inglés |
Publicado: |
Birmingham ; Mumbai :
Packt Publishing
2018.
|
Edición: | 1st edition |
Materias: | |
Ver en Biblioteca Universitat Ramon Llull: | https://discovery.url.edu/permalink/34CSUC_URL/1im36ta/alma991009630702006719 |
Tabla de Contenidos:
- Cover
- Title Page
- Copyright and Credits
- Dedication
- Packt Upsell
- Contributors
- Table of Contents
- Preface
- Chapter 1: Introduction to Progressive Web Apps
- Why we needed a new way to build websites
- Real-world PWA examples
- What are PWAs?
- Peak app
- PWA features
- PWA advantages
- PWA technical requirements
- The application shell
- 2048
- The source code
- The application's code structure
- Adding node modules to the project
- Adding a manifest
- Adding a service worker
- Summary
- Chapter 2: Creating a Home Screen Experience with a Web Manifest
- Why add to homescreen is important
- Making your PWA iOS web app capable
- The application title is set with another META tag
- The web manifest specification
- Referencing the web manifest file
- Web manifest properties
- Controlling the launch style
- Apple Safari web manifest support
- Validating web manifest files
- The Chrome improved add to homescreen experience
- The add to homescreen experience
- The Chrome add to homescreen experience
- Your add to homescreen responsibilities
- Disabling the homescreen prompt
- Tracking homescreen installs
- Polyfiling the homescreen experience on iOS and other legacy browsers
- Should you polyfil response caching?
- Microsoft Edge and Internet Explorer
- Benefits await without Polyfils
- Testing the add to homescreen experience in Chrome
- Summary
- Chapter 3: Making Your Website Secure
- SSL history
- How does TLS work?
- What is HTTPS?
- HTTPS advantages
- Identity
- Confidentiality
- Integrity
- Browsers are going out of their way to indicate HTTPS to the customer
- Search engine optimization
- No longer cost-prohibitive
- Modern APIs require HTTPS
- HTTPS can be significantly faster than HTTP
- HTTPS adoption
- Different types of SSL certificate
- Domain-validated certificates.
- Organization-validated certificates
- Extended-validation SSL certificates
- How to obtain and install an SSL certificate
- Migrating a website to HTTPS
- Auditing the site for any HTTP:// link references
- Auditing content and data
- Updating social media links
- Configure server auto-redirect of HTTP to HTTPS
- Add and verify all domain protocol combinations in webmaster tools
- Defining a canonical HTTPS link
- Updating Google analytics to default to HTTPS
- Updating the sitemap and RSS feed to HTTPS
- Updating your robots.txt file
- Summary
- Chapter 4: Service Workers - Notification, Synchronization, and Our Podcast App
- The service worker thread
- Service worker browser support
- Microsoft Edge service worker support
- Safari service worker support
- Is the service worker ready?
- Polyfilling older browsers
- The podcast application
- The Fetch API
- Introducing Fetch
- Using the Fetch API
- The response object
- Service worker fetch
- Polyfilling fetch in legacy browsers
- Creating a service worker shell
- The service worker life cycle
- Caching
- Using push notifications
- Implementing push notifications
- Setting up push notifications
- Managing the user's subscription
- Handling push notifications
- Unsubscribing from push notifications
- Handling a push subscription change
- Background sync
- Summary
- Chapter 5: The Service Worker Life Cycle
- Registering a service worker
- Service worker clients
- The service worker registration object
- Updating a service worker
- Service worker scope
- Service worker updates
- Service worker events
- Summary
- Chapter 6: Mastering the Cache API - Managing Web Assets in a Podcast Application
- Using the Fetch API
- Request object
- Handling cross-origin requests
- Managing request credentials
- Controlling how a response is cached
- Headers object.
- Adding Headers
- Accessing Header values
- Protected Headers
- Body mixin
- Response object
- Response properties
- Verifying a successful response
- Caching responses
- Caches object
- caches.open
- caches.match
- caches.has()
- caches.delete()
- caches.keys()
- The Cache object
- cache.match()
- cache.matchAll
- Cache add and addAll
- cache.put
- Deleting Cached items
- cache.keys
- Summary
- Chapter 7: Service Worker Caching Patterns
- How the service worker cache works
- Service worker events
- Caching patterns and strategies
- Precaching
- Installing as a dependency
- Installing not as a dependency
- On activate
- Real-time caching
- On user interaction
- On network response
- Stale while revalidating
- On push notification
- On background sync
- Cache only
- Network only
- Cache falling back to network
- Cache and network race
- Network falling back to cache
- Generic fallback
- Service worker templating
- Summary
- Chapter 8: Applying Advanced Service Worker Cache Strategies
- What is PWA tickets?
- Reviewing the PWA ticket application
- Using the JSON server for an API
- Making a database and the API
- Using faker
- Generating QR codes
- Rendering the website
- The PWA ticket rendering architecture and logic
- The PWA ticket JavaScript architecture
- The PWA ticket service worker architecture
- The ResponseManager
- Using the request method to determine the caching strategy
- Matching routes with caching strategies
- Cache invalidation strategies
- Unique hash names and long time-to-live values
- Maximum items in a cache
- Purging stale responses using time to live
- Executing ResponseManager
- The Invalidation Manager
- maxItems strategy
- The time-to-live invalidation strategy
- Using a real-time asset manifest
- How much should you cache?
- Summary.
- Chapter 9: Optimizing for Performance
- The importance of WPO
- Reducing image payload size
- The cost of CSS and JavaScript
- Proper test devices and emulation
- Testing poor conditions using developer tools
- Performing performance and PWA testing with Lighthouse
- Using WebPageTest to benchmark performance
- Key performance indicators
- Time to first byte
- The PRPL pattern
- Implementing push with browser hints and the service worker cache
- Using the app shell model and service worker to render the initial route
- Service worker pre-caching important routes
- Lazy-loading non-critical and dynamic routes
- The RAIL pattern
- How JavaScript clogs the pipeline
- Why 14 KB is the magic number
- Inline critical CSS
- Minifying scripts with uglify
- Using feature detection to conditionally load JavaScript polyfils
- Lazy loading images
- Summary
- Chapter 10: Service Worker Tools
- Using PWABuilder to scaffold your PWA
- Generating a valid web manifest file
- Building a service worker
- Downloading your site's PWA assets
- Scaffolded PWA images
- Running PWABuilder locally
- Auditing web pages using Lighthouse
- Running Lighthouse from the Chrome Developer Tools
- Running Lighthouse as a command-line utility
- Lighthouse and headless testing
- Running Lighthouse in a Node script
- Continuous build with Lighthouse
- Auditing web pages with Sonar
- Using the Sonar CLI
- Sonar components
- Configurations
- Connectors
- Formatters
- Parsers
- Rules
- Automating site audits with the Sonar node module
- Making complex service workers with workbox
- Installing workbox
- Workbox structure
- Service worker setup
- Pre-caching with Workbox
- Dynamic routes with Workbox
- Caching strategies
- Workbox cache invalidation
- Adding background sync functionality.
- Using Google Analytics, even when the user is offline
- Summary
- Other Books You May Enjoy
- Index.