Loading...

ReactNYC - Building Modern Media Experiences in React Apps - Prosper Otemuyiwa (@unicodeveloper)

601 views

Loading...

Loading...

Transcript

The interactive transcript could not be loaded.

Loading...

Loading...

Rating is available when the video has been rented.
This feature is not available right now. Please try again later.
Published on Nov 4, 2017

70% of the internet is made up of videos & audios In this talk, the audience will learn everything they need to know about playback controls, offline media, image & video optimization and transformation, pre-loading, deep learning with Images, audio & improving web performance by using the right tools while dealing with media assets in their react apps.

CONTENTS
0:05 - Intro
0:15 - Google Developer Expert
0:40 - Community Evangelist
1:15 - User experiences Across The World With Media on Web
3:16 - UX: Loading Video on a slow 3G network
3:35 - UX: Watching Man’s Not Hot when device goes offline
3:59 - UX: Accessing an Image on second load when it doesn’t come instantly
4:47 - After 2 secs of buffering users start dropping off at around 6% per second
5:29 - Modern Media
6:38 - Anatomy of Modern Media Experience
6:54 - Case studies - Modern Media Experience
8:25 - Building the Modern Media Experience… Your turn!
8:35 - Recommended Video players
10:00 - Fast playback with adaptive bitrate streaming
11:24 - Fast playback with video preload
13:47 - Smart video preload considerations
18:38 - Great UX
18:44 - Screen Orientation API
20:21 - Playground Playback & Page Visibility
21:28 - Intersection Observer API
23:07 - Media Session API
25:17 - Image & Video Transformations
29:28 - Offline
29:38 - Background Sync
30:38 - Background Fetch
31:46 - Modern Media Experience Demo

RESOURCES

Google Shaka Player
https://github.com/google/shaka-playe...

Cloudinary Video Player
https://cloudinary.com/documentation/...

Cloudinary-React
https://github.com/cloudinary/cloudin...

Workbox
https://developers.google.com/web/too...

Background Fetch Intro
https://www.youtube.com/watch?v=hUS24...

Background Fetch API
https://www.chromestatus.com/feature/...

Demos of all presented APIs
https://biograf-155113.appspot.com

Loading...

When autoplay is enabled, a suggested video will automatically play next.

Up next


to add this to Watch Later

Add to

Loading playlists...