Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Better Performance & Uptime Through Async

xyu
May 14, 2016

Better Performance & Uptime Through Async

Asynchronous programming makes your site both faster and more reliable. Let’s peal back the covers of Jetpack Stats and steal some of the concepts that can make our site faster and more stable.

xyu

May 14, 2016
Tweet

More Decks by xyu

Other Decks in Technology

Transcript

  1. @HypertextRanch

    [email protected]

    xyu.io

    xyu




    Better Performance & Uptime Through Async
    WordCamp Maine 2016

    View full-size slide


  2. Automattic — Data Infrastructure Team

    View full-size slide


  3. 22,000,000,000 Page Views
    3,500,000,000 Uniques
    110,000,000 Blogs

    View full-size slide

  4. 1 MILLION MODULES
    1 MILLION MODULES

    View full-size slide

  5. 22 Billion Views × 100ms = 69 Person Years

    View full-size slide

  6. Asynchronous Programing

    View full-size slide


  7. Don’t Block The Critical Path

    View full-size slide

  8. https://developers.google.com/web/fundamentals/performance/critical-rendering-path/analyzing-crp

    View full-size slide

  9. https://developers.google.com/web/fundamentals/performance/critical-rendering-path/analyzing-crp

    View full-size slide

  10. Load Jetpack & WordPress.com Stats Async

    View full-size slide

  11. src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>
    src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>

    View full-size slide

  12. src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>
    src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>

    View full-size slide

  13. src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>
    src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>

    View full-size slide

  14. src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>
    src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>

    View full-size slide

  15. src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>
    src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>

    View full-size slide

  16. src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>
    src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>

    View full-size slide

  17. src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>
    src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>

    View full-size slide

  18. src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>
    src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>

    View full-size slide

  19. src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>
    src='https://stats.wp.com/e-201618.js'
    async defer>

    <br/>_stq = window._stq || [];<br/>_stq.push( [ 'view', {<br/>v:'ext',<br/>j:'1:4.0.2',<br/>blog:'105573785',<br/>post:'0',<br/>tz:'-5',<br/>srv:'2016.maine.wordcamp.org'<br/>} ] );<br/>

    View full-size slide

  20. Asynchronous Processing

    View full-size slide

  21. Asynchronous Processing Queues

    View full-size slide

  22. Counting Uniques — Naïve Approach

    View full-size slide

  23. Counting Uniques — Actual Approach

    View full-size slide

  24. Processing Pixels
    • Loggers
    • Aggregator & Preprocessor
    • Kafka Queue
    • ETL Pipeline
    • Hive Datastore
    • Counting Uniques
    • Export Results to MySQL

    View full-size slide

  25. WP Cron — Schedule Async Hooks

    View full-size slide

  26. function some_action( $arg1, $arg2 ) {
    // do something
    }
    add_action(
    'my_new_event',
    'some_action',
    10,
    2
    );
    wp_schedule_single_event(
    time() + 10, // in 10 seconds
    'my_new_event',
    array( $arg1, $arg2 )
    );

    View full-size slide

  27. @HypertextRanch

    [email protected]

    xyu.io

    xyu




    Thanks!

    View full-size slide