User Experience on mobile might not be great yet, but I'm working on it.

Your first time on this page? Allow me to give some explanations.

Awesome Mobile Web Development

All that you need to create a great mobile web experience

Here you can see meta information about this topic like the time we last updated this page, the original creator of the awesome list and a link to the original GitHub repository.

Last Update: Dec. 2, 2020, 6:11 a.m.

Thank you myshov & contributors
View Topic on GitHub:
myshov/awesome-mobile-web-development

Search for resources by name or description.
Simply type in what you are looking for and the results will be filtered on the fly.

Further filter the resources on this page by type (repository/other resource), number of stars on GitHub and time of last commit in months.

Articles and Documentation

Everything you need to know to create offline-first web apps.

2.68K
188
3y 7d
CC0-1.0

How to make a really fast mobile website (by Flipboard).

How to optimize site for specific hardware and network constraints.

A case study on achieving fast animations on mobile web (by Yelp).

How to setup Cache-Control to achieve the best reponse time.

An advices on web development for Galaxy Fold.

On issues with dark themes on OLED displays and what to do with them.

A diagram that shows in which cases JavaScript can be unavailable.

The compilation of good articles about mobile web development.

An overview of negative practices on mobile sites.

What you can do with web app to achieve better battery life.

A hands-on introduction to Accelerated Mobile Pages focusing on code and live samples.

A little bit out of date but still useful list of best practices for mobile websites from W3C.

The list of best practices for mobile web applications from W3C.

Guideline (must read) from Mozilla about designing mobile websites.

Reason why you need to self-host your static assets.

On performance as a key factor for the business.

A service worker strategy for dealing with lie-fi (a bad network connection).

Wide range of recommendations for making Web content more accessible.

Guideline from Google about creating good mobile web experiences.

An interesting paper about websites' power consumption.

Books

Free small ebook on mobile performance from Awwwards.

Guide on building offline experience with service workers.

How to design sites for mobile devices (free online version).

Specifications from W3C for Enhancing Mobile Web Experience

On access to information about the battery.

On access to information about connection.

The spec for exposing sensor data.

On user access to camera or microphone.

On payment method with minimal integration.

On access to presentation displays.

On controlling remote playback of media from a web page.

On access to the vibration mechanism of the hosting device.

On access to a visual portion of a screen excluding on-screen keyboards, areas outside of a pinch-zoom area etc..

On access to wake lock request (prevents some aspect of a device from entering the power-saving state).

On an API to discover and communicate with devices over the Bluetooth 4.

On access to Near Field Communication capabilities of the device.

On an API for end-user notifications.

Talks

Overview of practices for adapting a site to hardware and network constraints, by Addy Osmani, Nate Schloss.

Overview of the best practices for mobile web development, by Matt Gaunt.

The glimpse on how to optimize web apps and sites using streams and service workers and other new APIs, by Jake Archibald.

What to do on your site to achieve the best possible mobile experience, by Estelle Weyl.

How to audit performance issues on the site, by Paul Lewis.

Auditing Tools

Automated auditing, performance metrics, and best practices for the web.

21.2K
7.44K
1d
Apache-2.0

Tool for testing that your site is mobile-friendly.

The tool that analyzes your page and gives recommendations for increasing downloading speed.

Web server modules that optimize your site automatically.

Compare the speed of your mobile site to others.

The tool from Google that performs comprehesive speed check of the mobile site.

Website speed test from multiple locations using real browsers and at real consumer connection speeds.

Platform Monitoring

State of support of various web features in browsers.

Market share between various platforms and countries.

What your browser capable of.

Other Useful Tools and Libraries

Console for mobile browsers

9.55K
769
11d
MIT

JavaScript drag and drop, resizing and multi-touch gestures with inertia and snapping for modern browsers (and also IE9+)

9.81K
682
3d
MIT

Polyfill to remove click delays on browsers with touch UIs

18.36K
3.28K
1y 9m
MIT

🔥 Highly performant, light ~1kb and configurable lazy loader in pure JS with no dependencies for responsive images, iframes and more

6.53K
427
9d
MIT

An easily internationalizable, mobile-friendly datepicker library for the web

11.09K
1.58K
23d
MIT

🌟 Shiny reflections for mobile websites

2.81K
76
62d
MIT

A touch slideout navigation menu for your mobile web apps.

7.95K
1.25K
2y 9m
MIT

Most modern mobile touch slider with hardware accelerated transitions

25.52K
9.25K
1d
MIT

Web Starter Kit - a workflow for multi-device websites

18.51K
3.19K
2y 10m
Apache-2.0

Time-saving synchronised browser testing.

Web inspector for debugging sites in non-mainstream browsers.

a set of libraries and Node modules that make it easy to cache assets and take full advantage of features used to build progressive web apps.

Library to provide a full representation of the DOM inside of Web Workers.