字幕组成品列表（Beta）
  • 写在前面
  • Android 平台
    • Game On! 游戏开发系列 - 031
      • Pie Noon - 1503060393
      • The Death of Base Game Activity - 1504030543
      • Surviving OpenGL Context Loss - 1504030546
      • WebP for Game Devs - 1504030547
      • Saved Games In-Depth (Part 1) - 1504070556
      • Saved Games In-Depth (Part 2) - 1504030548
      • Smaller Flipbook Textures with CRABBY - 1504030544
      • Google Tag Manager - 1504030545
      • Flatbuffers - 1505050794
      • Achievement Point Pointers - 1505050796
      • Frequency Scaling - 1505050797
      • Meet the Management APIs - 1501140367
      • Y U Ship Broken Games - 1505050795
    • Android 性能优化 - 088
      • Garbage Collection in Android - 1503170425
      • Performance Cost of Memory Leaks - 1503170424
      • Rendering Performance 101 - 1501130351
      • Understanding Overdraw - 1501130352
      • Understanding VSYNC - 1501130353
      • Tool - Profile GPU Rendering - 1501130354
      • Why 60fps? - 1501130355
      • Android UI and the GPU - 1501130356
      • Invalidations, Layouts, and Performance - 1501130357
      • Overdraw, Cliprect, QuickReject - 1501130358
      • Tool - Memory Monitor - 1501130363
      • Battery Performance 101 - 1501130364
      • Understanding Battery Drain on Android - 1501130365
      • Battery Drain and WakeLocks - 1501130366
      • Memory Performance 101 - 1504170661
    • I/O 2014 Android 开发专题 - 089
      • Activity Transitions - 1504020505
      • Building Apps For Android TV - 1504020520
      • Building great Android media experiences - 1504020510
      • Building a quality app from start to finish - 1504020515
      • App Indexing API - 1504020507
      • What's new in WebView - 1504010484
      • Bluetooth Low Energy - 1504010486
      • Building impressive Android media experiences - 1504010493
      • The next Generation of Authentication - 1504020497
      • Don't Alpha That Pixel! - 1504020523
      • NFC + HCE Your phone in an interactive world - 1504020509
      • Demystifying encodes and decodes of WebM - 1504020521
      • Google Cloud Messaging - 1504020524
      • Getting your Game on the Big Screen - 1504020518
      • I hear you like realtime memes - 1504020511
      • Offerize your App - 1504020506
      • Using the Android Job Scheduler - 1504020504
      • From Holo to Material - 1504020526
      • Under the Hood of Android Auto - 1504020501
      • Isolation for Android App Developers - 1504020498
      • Android Work - 1504010496
      • ExoPlayer: Adaptive video streaming on Android - 1504010489
      • Sample rates and resampling: Why can't we all just agree? - 1504010488
      • Drive Android API - 1504010485
    • Android Studio - 004
      • Layout Editor (Ep 3, Android Studio) - 1503290479
      • Introducing Gradle (Ep 2, Android Studio) - 1503170426
    • I/O 2014 Android 分发主题 - 091
      • Introduction to Google Play - 1504030534
      • Google Play: building your user community - 1504030535
      • Optimizing Apps for Education - 1504030536
      • Succeeding in Education Technology - 1504030530
      • Subscriptions Made Easy with Google Play - 1504030531
      • The world is your playground - go global with Google - 1504030533
      • Maximizing discoverability on Google Play - 1504030538
    • Android Auto - 003
      • Introduction to Android Auto - 1504130615
      • Android Auto Messaging - 1504130617
      • Android Auto Audio - 1504130616
    • Android Wear - 006
      • Designing for Android Wear - 1503210448
      • How We Customized Google Apps for Android Wear - 1503210450
      • Fullscreen apps for Android Wear - 1503210445
      • New Notification Features for Android Wear - 1503210446
      • Building Cloud-powered wearable Apps - 1503210449
      • An Introduction to Android Wear - 1503190435
      • Google I/O 2014 - Android Wear: The developer's perspective - 1503210442
      • Devoxx 2014 Interviews: Android Wear - 1503210440
      • DevBytes: Watch Faces for Android Wear - 1503210439
    • Android TV - 005
      • Using the Leanback library - 1504080588
      • Beach Buggy Racing Multiplayer with Nearby Connections (Play Services) - 1503060387
    • Android for Work - 106
      • Android for Work for Developers - 1503060390
      • App Configurations, Testing and Launchers - 1504110590
    • IO Bytes 2014 - Android - 066
      • Chrome Apps on Android and iOS - 1501080014
      • Perf Primer CPU, GPU and your Android game - 1501080017
  • Chrome 平台
    • IO Bytes 2014 - Chrome and Web - 067
      • Using the PageSpeed API - 1505070815
      • Fabulous Forms for the multi-device web - 1505070816
      • Testing multi-screen web pages - 1505070817
      • Responsive images today - 1505070819
      • Web Performance Testing at YouTube - 1505070828
      • Building sites for the multi-device web - 1505070820
      • Deep dive: Google Cloud Messaging for Chrome - 1505070827
  • Google 创业者资源
    • Coffee with a Googler - 012
      • Chat with Allen Huang of AndroidTV - 1503040384
      • Chat with Fred Chung about developer advocacy - 1503070395
      • Google Fit platform with Michelle Haq - 1503210443
      • Android Auto Product Manager Andrew Brenner - 1501120027
      • Chat with Francis Ma about Google Play services - 1501120028
    • Root Access For Startups - 077
      • What we learned building plug-ins for Android, with startup Magnet - 1503230453
      • How to use crowdfunding to your advantage, with startup Hale Devices - 1503280462
      • How to overcome customer objections when selling tech, with startup Guesswork - 1503280458
    • First Things First - 029
      • Getting started with Android: A crash-course in developing for Android - 1504120601
      • How to ask a question: conducting research for your startup - 1504120603
      • MVP Design Hacks: transform your hot idea into a validated prototype - 1504120602
      • Build something people want: Solving real problems - 1504120605
    • How I - 061
      • Use BigQuery to find my most valuable customers - 1504070573
      • Manage beta testing communities using Google Play - 1504070572
      • Use paper wireframing to build native prototypes - 1504070570
      • Used social media and $0 marketing to get 68 million users - 1504070568
      • Prep to fundraise with four questions - 1504070564
      • Validated my idea in 2 days (with no code) - 1504070562
      • Build open platforms on Android - 1504120596
      • Get cheap, automatic analytics for my business using BigQuery - 1504070571
      • Write press releases to get international media coverage - 1504070569
      • Test beta-product features using Google Apps - 1504070563
      • Use URL builder to measure ROI on social media - 1504070561
      • Use events to build DeadSocial's brand - 1504070557
      • Use BigQuery to visualize streaming data - 1503220452
      • Find, screen, and hire developers - 1503120406
      • Drive engagement with social challenges - 1504070558
  • 设计
    • DesignBytes - 017
      • Paper and Ink: The Materials that Matter - 1505050793
  • 云计算
    • DevBytes: Google Cloud Platform - 021
      • Powering the next killer app with the Google Cloud Platform - 1504210672
      • Introduction to Google Cloud Endpoints - 1504210675
      • The Beauty of Scale with Google Cloud Platform - 1504210678
    • Google Cloud Platform - Big Data - 105
      • GDELT & BigQuery: Understand the world - 1502200379
    • Uncategorized - 999
      • Introducing Google Cloud Platform Resources - 1501190370
  • Google 应用开发
    • Launchpad Online - 072
      • The Setup: Creating new apps using Google APIs - 1503190428
      • Listing your files in Google Drive - 1503190429
      • Customizing Google Analytics for your startup - 1503290473
      • The Launchpad Online series - 1503190427
      • Getting started with Google Analytics - 1503290472
      • Accessing Google Maps from a spreadsheet?!? - 1502220381
      • Change the world in 10 lines of code - 1503080398
    • Google Play Services - 054
      • Google Play services 6.1 - 1503290481
      • Google Play Services 7.0 - 1503200437
      • Google Play Services 6.5 - 1501080015
    • 谷歌地图 iOS SDK - 053
      • Maps Live: New Features in the Google Maps Mobile APIs for Android and iOS - 1504300777
    • Google 移动搜索开发 - 055
      • Is your app in the Google index? - 1504120598
      • Get more engaged users with Google Search for Developers - 1503070397
    • DevBytes: Google Cast - 020
      • Google Cast SDK for Android - 1504180666
      • Media Router Framework - Part 1 - Media Router API - 1504180667
      • Overview for Google Cast Receivers - 1504180664
      • Google Cast SDK for iOS - 1504180663
    • Getting Started with the Google Maps SDK for iOS - 035
      • Getting started with the Google Maps SDK for iOS, Part 1 - 1504270757
    • IO Bytes 2014 - Wearables - 070
      • Voice Driven GDK Glassware - 1505280836
    • Route 85 - 078
      • Introducing Route 85 - 1501120022
      • Quick Tip: Don't Default that Switch! - 1501190371
      • OpenInChrome on iOS, Part 1 - 1501120023
      • OpenInChrome on iOS, Part 2 - 1501120024
      • OpenInChrome on iOS, Part 3 - 1501120025
      • OpenInChrome on iOS, Part 4 - 1501120026
    • DevBytes 2014 - 019
      • Web Components - Template - 1505040789
      • Wearable DataLayer API - 1505050792
      • Using srcset for responsive images - 1505050790
      • The picture element for art direction - 1505050791
    • Uncategorized - 999
      • Sun Surveyor brings augmented reality to photographers using Google Maps APIs - 1504200668
      • Snappy travels with the Roads API - 1503060392
      • Easy Maps Apps in Java and Python - 1501140030
  • Google 广告平台
  • Polymer
    • Polycasts - 076
      • The Awesome Power of Auto-Binding Templates -- Polycasts #08 - 1502220382
      • Content Switcheroo with Core-Pages -- Polycasts #09 - 1502200380
      • Core Iconset -- Polycasts #02 - 1505040788
  • Web 平台
    • HTTP 203 - 062
      • Gotchas - 1501140368
      • Font Rendering - 1501080016
    • Web Components - 081
      • DevBytes: Web Components - Overview - 1504250709
  • 宣传视频
    • Uncategorized - 999
      • Google Developers - 1501150369
      • I/O Extended 2014 - Join me - 1502220383
  • Google 各类开发者会议
    • 2014 Chrome 开发者高峰会议 - 009
      • Keynote - Chrome Dev Summit 2014 (Darin Fisher) - 1503120407
      • TLS All the Things! - Security with Performance(Chris Palmer) - 1503140412
      • Let’s build some apps with Polymer!(Rob Dodson) - 1503150415
      • Day One Closing Remarks(Sundar Pichai) - 1503150417
      • Chrome Leadership panel - 1503160422
      • Fundamentals of Mobile Web Development(Matt Gaunt) - 1503150416
    • 2015 游戏开发者大会中 - 039
      • FlatBuffers - 1504150640
      • Games for Google Cast - 1504150637
      • Top 10 Things Android Game Developers Should Know v 3.0 - 1504150643
      • Automate Publishing for Google Play APIs - 1504150639
      • 3 Game Design Mistakes You're Making - 1504150636
      • Android TV - 1504150638
      • How to Go Viral Without Really Trying - 1504150641
    • Devoxx 2014 Interviews - 024
      • What's new in Android 5.0 Lollipop - 1504260740
      • Android Tools - 1504260743
      • BigQuery and user-defined functions - 1504260744
    • IO Bytes 2014 - 065
      • Dart in Google Cloud - 1505070810
      • Big genomic data on Google Cloud Platform - 1505070811
      • Easy International Checkout with Chrome - 1505070802
      • Google developer tools and APIs for iOS - 1503190436
      • Whet your appetite with IO Bytes - 1501080021
    • PlayTime@Shanghai - 095
      • 主题演讲 Chris Yerga - 1504060549
      • 如何成功地开发你的应用 Ellie Powers - 1504060550
      • 在Google上营利 Brahim Elbouchikhi - 1504060551
      • Playtime Shanghai event sizzle reel - 1504070552
    • Project Google I/O 2015 - 098
      • Project Tango Mobile 3D tracking and perception - 1506120857
      • Democratizing Education - 1506120868
      • Improve your Android app’s accessibility - 1506120864
      • Google Cloud Messaging 3.0 - 1506120844
      • Developers connecting the world through Google Play - 1506120862
  • 开源开放技术
    • Compressor Head - 013
      • The Trailer, Season 2 - 1503060385
      • Behind the Scenes - 1503210441
      • Arithmetic Compression (Ep 5, Compressor Head) Google - 1503070394
      • Introducing Compressor Head - 1502120372
      • Episode 1 (Variable Length Codes) - 1502120373
      • Episode 2 (The LZ77 Compression Family) - 1502120374
      • Episode 3 (Markov Chain Compression) - 1502120375
Powered by GitBook
On this page
  • 译者信息
  • 解说词中文版：

Was this helpful?

  1. Chrome 平台
  2. IO Bytes 2014 - Chrome and Web - 067

Web Performance Testing at YouTube - 1505070828

PreviousResponsive images today - 1505070819NextBuilding sites for the multi-device web - 1505070820

Last updated 5 years ago

Was this helpful?

视频发布时间

2014年6月25日

视频介绍

Even though YouTube operates at a scale of over a billion users per month, web performance testing follows the same core principles that you can apply to your own site. In this video, learn about how we measure the page load speed and how we instrument tests to make the experience even faster. We'll look at two front end performance testing methodologies: Real User Monitoring (RUM) with Client Side Instrumentation and synthetic testing with WebPagetest.

视频推介语

暂无，待补充。

译者信息

翻译

润稿

终审

原始链接

中文字幕

翻译流水号

加入字幕组

wang7x

高冰

--

1505070828

解说词中文版：

大家好

我是Rick Viscomi 负责优化YouTube

在本集视频中 我会和大家分享

我们是如何测试网页性能的

还会说一说个人网站比较实用的技巧

这里有两种测试网页性能的方法

一个是Real User Monitoring（真实用户监控） 简称RUM 另一个是Synthetic testing

真实用户监控 正如它的字面含义

它会收集用户浏览网站时与性能有关的数据

对于YouTube而言 RUM为我们全方位地提供了

用户对网站的体验状况

再来看Synthetic testing 它更像一个实验室

通常用于根据需求来分析特定的用户案例

两种方法都会收集性能数据

但二者的区别在于 RUM侧重于衡量

网页的加载速度 Synthetic testing侧重于

如何让网页更快的加载出来

收集和分析RUM数据最简单的方法

是使用现有的性能分析产品

实际上 Google Analytics就是这么一个工具

在Google 我们使用一套我们自己定制的解决方案

称为Client Side Instrumentation 缩写CSI

RUM的工作方式可视为三层结构

首先 我们部署客户端代码

用于提供网页计时(Timing)和网页状态数据给RUM JavaScript脚本库

然后 脚本库将这些数据打包

发送给分析服务器

最后 分析服务器

通过一个仪表盘展示分析结果

大多数RUM工具在监测网页时 一般都会调用现有的

对于我们来说 视频播放速度

是我们很看重的一项性能指标

指标的制定要根据

应用的功能

和用户期望来制定

还有一点很重要 那就是需要考虑

可能影响性能的上下文信息

比如 YouTube用户可能会用到实验性的功能

我们就需要了解

这些功能对性能可能会产生什么样的影响

通过跟踪变量的变化

我们能更好的了解

特定用户群体的情况

同样 在关键路径和视频重放之后

CSI beacon会被悄悄的发送

这有助于使测试不会

影响到用户的体验

为了分析性能数据 我们来看看CSI仪表盘

在这 我们能够看到随时间变化的性能曲线

可以对照比较实验组和正常操作组的数据

例如 在这个折线图中

我们拿实验的数据和正常操作的数据进行比较

在最后一个节点之前 实验组数据的耗时更低 运行更快

我们可以在CSI仪表盘上

将数据按变量进行分离 以便理解是什么造成了这样的结果

我们按照浏览器将数据分割

可以很清晰的看出浏览器B导致了

性能的下降

值得一提的是 由于我们是

从海量用户中收集数据

他们使用不同的设备 处在不同的网络环境中

我们通常会

取统计数据中的中位数

来代表性能的好坏

好了

RUM就说到这里

现在我们再来看看synthetic testing

我们使用WebPagetest 这是一个免费 公开的工具

我们不从真实用户那里收集数据

相反 配置synthetic test面向一个特定的统计群体

为了减少网络异常带来的影响

这些测试运行在一个类似于实验的环境下

并会重复试验

因此多次反复测试会令结果更加可信

最后 当结果出来后

我们就能根据测试时的网络日志

分析指定的指标项

WebPagetest能够让你完全掌控

你想要测试的用例类型

例如 我们可能对DSL连接下

Chrome浏览器浏览网页的性能感兴趣

作为一个免费公开的工具

WebPagetest运行在联网的普通计算机上

然而 为了测试YouTube 我们需要更多的访问权限

才能访问YouTube的beta版本

因此 在Google内部

我们运行私有的WebPagetest实例

测试结果通过一个图形化的瀑布流图

来展示网络中的各项活动

在这个视图中 我们能够精确的看到

视频重放在关键路径上的活动

最后 WebPagetest还在瀑布流上注明了

我们为YouTube指定的指标

这为我们提供了必要的上下文信息

以确定具体是什么导致了性能下降

关于synthetic testing就说到这里

记住RUM仅在你提供了有用的指标时才起作用

CSI只是众多工具中的一种

并且你的解决方案应该不能影响到用户体验 而且还要是轻量级的

Synthetic test应当被设置为

代表普遍的用例 例如特定的浏览器

连接 和网页统计口径

并且 通过在内部网络

部署synthetic test服务器

你可以在发布之前验证性能

想要了解更多NavigationTiming API的信息

打开这个链接 查看Mozilla Developer Network的文章

想要了解更多使用WebPagetest的信息

访问这个连接 并且留意

今年晚些时候我出版的书

谢谢观看

Youtube
Youtube
加入 GDG 字幕组
video_screenshot