舉報 
會員
Progressive Web Application Development by Example
Areyouadeveloperthatwantstocreatetrulycross-platformuserexperienceswithaminimalfootprint,freeofstorerestrictionsandfeaturescustomerswant?ThenyouneedtogettogripswithProgressiveWebApplications(PWAs),aperfectamalgamationofwebandmobileapplicationswithablazing-fastresponsetime.ProgressiveWebApplicationDevelopmentbyExamplehelpsyouexploreconceptsofthePWAdevelopmentbyenablingyoutodevelopthreeprojects,startingwitha2048game.Inthisgame,youwillreviewpartsofawebmanifestfileandunderstandhowabrowserusespropertiestodefinethehomescreenexperience.Youwillthenmoveontolearninghowtodevelopanduseapodcastclientandbeintroducedtoserviceworkers.Theapplicationwilldemonstratehowserviceworkersareregisteredandupdated.Inadditiontothis,youwillreviewacachingAPIsothatyouhaveafirmunderstandingofhowtousethecachewithinaserviceworker,andyou'lldiscovercorecachingstrategiesandhowtocodethemwithinaserviceworker.Finally,youwillstudyhowtobuildaticketsapplication,whereinyou’llapplyadvancedserviceworkertechniques,suchascacheinvalidation.Also,you'lllearnabouttoolsyoucanusetovalidateyourapplicationsandscaffoldthemforqualityandconsistency.Bytheendofthebook,youwillhavewalkedthroughbrowserdevelopertools,nodemodules,andonlinetoolsforcreatinghigh-qualityPWAs.
最新章節
- Leave a review - let other readers know what you think
- Other Books You May Enjoy
- Summary
- Using Google Analytics even when the user is offline
- Adding background sync functionality
- Workbox cache invalidation
品牌：中圖公司
上架時間：2021-08-05 10:28:31
出版社：Packt Publishing
本書數字版權由中圖公司提供，并由其授權上海閱文信息技術有限公司制作發行
- Leave a review - let other readers know what you think 更新時間：2021-08-05 10:34:05
- Other Books You May Enjoy
- Summary
- Using Google Analytics even when the user is offline
- Adding background sync functionality
- Workbox cache invalidation
- Caching strategies
- Dynamic routes with Workbox
- Pre-caching with Workbox
- Service worker setup
- Workbox structure
- Installing workbox
- Making complex service workers with workbox
- Automating site audits with the Sonar node module
- Rules
- Parsers
- Formatters
- Connectors
- Configurations
- Sonar components
- Using the Sonar CLI
- Auditing web pages with Sonar
- Continuous build with Lighthouse
- Running Lighthouse in a Node script
- Lighthouse and headless testing
- Running Lighthouse as a command-line utility
- Running Lighthouse from the Chrome Developer Tools
- Auditing web pages using Lighthouse
- Running PWABuilder locally
- Scaffolded PWA images
- Downloading your site's PWA assets
- Building a service worker
- Generating a valid web manifest file
- Using PWABuilder to scaffold your PWA
- Service Worker Tools
- Summary
- Lazy loading images
- Using feature detection to conditionally load JavaScript polyfils
- Minifying scripts with uglify
- Inline critical CSS
- Why 14 KB is the magic number
- How JavaScript clogs the pipeline
- The RAIL pattern
- Lazy-loading non-critical and dynamic routes
- Service worker pre-caching important routes
- Using the app shell model and service worker to render the initial route
- Implementing push with browser hints and the service worker cache
- The PRPL pattern
- Time to first byte
- Key performance indicators
- Using WebPageTest to benchmark performance
- Performing performance and PWA testing with Lighthouse
- Testing poor conditions using developer tools
- Proper test devices and emulation
- The cost of CSS and JavaScript
- Reducing image payload size
- The importance of WPO
- Optimizing for Performance
- Summary
- How much should you cache?
- Using a real-time asset manifest
- The time-to-live invalidation strategy
- maxItems strategy
- The Invalidation Manager
- Executing ResponseManager
- Purging stale responses using time to live
- Maximum items in a cache
- Unique hash names and long time-to-live values
- Cache invalidation strategies
- Matching routes with caching strategies
- Using the request method to determine the caching strategy
- The ResponseManager
- The PWA ticket service worker architecture
- The PWA ticket JavaScript architecture
- The PWA ticket rendering architecture and logic
- Rendering the website
- Generating QR codes
- Using faker
- Making a database and the API
- Using the JSON server for an API
- Reviewing the PWA ticket application
- What is PWA tickets?
- Applying Advanced Service Worker Cache Strategies
- Summary
- Service worker templating
- Generic fallback
- Network falling back to cache
- Cache and network race
- Cache falling back to network
- Network only
- Cache only
- On background sync
- On push notification
- Stale while revalidating
- On network response
- On user interaction
- Real-time caching
- On activate
- Installing not as a dependency
- Installing as a dependency
- Precaching
- Caching patterns and strategies
- Service worker events
- How the service worker cache works
- Service Worker Caching Patterns
- Summary
- cache.keys
- Deleting Cached items
- cache.put
- Cache add and addAll
- cache.matchAll
- cache.match()
- The Cache object
- caches.keys()
- caches.delete()
- caches.has()
- caches.match
- caches.open
- Caches object
- Caching responses
- Verifying a successful response
- Response properties
- Response object
- Body mixin
- Protected Headers
- Accessing Header values
- Adding Headers
- Headers object
- Controlling how a response is cached
- Managing request credentials
- Handling cross-origin requests
- Request object
- Using the Fetch API
- Mastering the Cache API - Managing Web Assets in a Podcast Application
- Summary
- Service worker events
- Service worker updates
- Service worker scope
- Updating a service worker
- The service worker registration object
- Service worker clients
- Registering a service worker
- The Service Worker Life Cycle
- Summary
- Background sync
- Handling a push subscription change
- Unsubscribing from push notifications
- Handling push notifications
- Managing the user's subscription
- Setting up push notifications
- Implementing push notifications
- Using push notifications
- Caching
- The service worker life cycle
- Creating a service worker shell
- Polyfilling fetch in legacy browsers
- Service worker fetch
- The response object
- Using the Fetch API
- Introducing Fetch
- The Fetch API
- The podcast application
- Polyfilling older browsers
- Is the service worker ready?
- Safari service worker support
- Microsoft Edge service worker support
- Service worker browser support
- The service worker thread
- Service Workers – Notification Synchronization and Our Podcast App
- Summary
- Updating your robots.txt file
- Updating the sitemap and RSS feed to HTTPS
- Updating Google analytics to default to HTTPS
- Defining a canonical HTTPS link
- Add and verify all domain protocol combinations in webmaster tools
- Configure server auto-redirect of HTTP to HTTPS
- Updating social media links
- Auditing content and data
- Auditing the site for any HTTP:// link references
- Migrating a website to HTTPS
- How to obtain and install an SSL certificate
- Extended-validation SSL certificates
- Organization-validated certificates
- Domain-validated certificates
- Different types of SSL certificate
- HTTPS adoption
- HTTPS can be significantly faster than HTTP
- Modern APIs require HTTPS
- No longer cost-prohibitive
- Search engine optimization
- Browsers are going out of their way to indicate HTTPS to the customer
- Integrity
- Confidentiality
- Identity
- HTTPS advantages
- What is HTTPS?
- How does TLS work?
- SSL history
- Making Your Website Secure
- Summary
- Testing the add to homescreen experience in Chrome
- Benefits await without Polyfils
- Microsoft Edge and Internet Explorer
- Should you polyfil response caching?
- Polyfiling the homescreen experience on iOS and other legacy browsers
- Tracking homescreen installs
- Disabling the homescreen prompt
- Your add to homescreen responsibilities
- The Chrome add to homescreen experience
- The add to homescreen experience
- The Chrome improved add to homescreen experience
- Validating web manifest files
- Apple Safari web manifest support
- Controlling the launch style
- Web manifest properties
- Referencing the web manifest file
- The web manifest specification
- The application title is set with another META tag
- Making your PWA iOS web app capable
- Why add to homescreen is important
- Creating a Home Screen Experience with a Web Manifest
- Summary
- Adding a service worker
- Adding a manifest
- Adding node modules to the project
- The application's code structure
- The source code
- 2048
- The application shell
- PWA technical requirements
- PWA advantages
- PWA features
- Peak app
- What are PWAs?
- Real-world PWA examples
- Why we needed a new way to build websites
- Introduction to Progressive Web Apps
- Reviews
- Get in touch
- Conventions used
- Download the example code files
- To get the most out of this book
- What this book covers
- Who this book is for
- Preface
- Packt is searching for authors like you
- About the reviewer
- About the author
- Contributors
- PacktPub.com
- Why subscribe?
- Packt Upsell
- Dedication
- Progressive Web Application Development by Example
- Copyright and Credits
- Title Page
- 封面
- 封面
- Title Page
- Copyright and Credits
- Progressive Web Application Development by Example
- Dedication
- Packt Upsell
- Why subscribe?
- PacktPub.com
- Contributors
- About the author
- About the reviewer
- Packt is searching for authors like you
- Preface
- Who this book is for
- What this book covers
- To get the most out of this book
- Download the example code files
- Conventions used
- Get in touch
- Reviews
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- 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
- Leave a review - let other readers know what you think 更新時間：2021-08-05 10:34:05
