Heartbeat API: Your Data Simply in Realtime

As of WordPress 3.9, the Heartbeat API is no longer experimental!

It’s intended to help developers synchronize data between a user’s browser and server without manually sending individual AJAX calls.

Attendees will learn how WordPress’ core implements Heartbeat, and how they can use it on their own sites to create more interactive and up-to-date admin screens.

As a bonus, users will learn how to make a WordPress site honk incessantly via a WordPress REST API endpoint.

Code and Context available at: http://www.getsource.net/2014/08/heartbeat-wp-rest-api-wordcamp-nyc/

Presented by Mike Schroder (http://getsource.net)

Transcript

1. Heartbeat API: your data simply in realtime.
   ! WordCamp NYC 2014 Mike Schroder (DH-Shredder) @GetSource - http://www.getsource.net
2. Who Am I? • Mike Schroder, a.k.a DH- Shredder, a.k.a. @GetSource • Third Culture Kid, enjoy Coffee & Sailing • WordPress 3.9 Co-Lead and co-author of Heartbeat API • Happy DreamHost Employee
3. WAT is Heartbeat API?
   
4. Realtime* Bidirectional communication via AJAX.
   
5. 15-30 seconds by default. 120 seconds when inactive.
11. EXPERIMENTAL WARNING!
    
12. EXPERIMENTAL WARNING!
    
13. No longer experimental as of WordPress 3.9
14. JS Trigger Flow
    ! ! -> heartbeat-send
    -> heartbeat-tick
    -/> heartbeat-error
    ! ! (wp-includes/js/heartbeat.js)
    
15. PHP Filter/Action Flow
    ! ! -> heartbeat_received
    -> heartbeat_send
    -> heartbeat_tick (action)
    ! ! (wp-admin/includes/ajax-actions.php)
16. if ( ! empty( $_POST['data'] ) ) { $data = (array) $_POST['data']; $response = apply_filters( 'heartbeat_received', $response, $data, $screen_id ); } $response = apply_filters( 'heartbeat_send', $response, $screen_id ); ! do_action( 'heartbeat_tick', $response, $screen_id ); // Send the current time according to the server $response['server_time'] = time(); wp_send_json($response); Direct from core.
18. wp-json/honk_horn custom REST endpoint demo
    
20. This is just a start.
    
21. Resources! • getsource.net/2014/01/heartbeat-api-wordcamp-phoenix/ • gist.github.com/getsource/6254495 • core.trac.wordpress.org/browser/tags/3.9/src/wp-includes/js/heartbeat.js • pippinsplugins.com/using-the-wordpress-heartbeat-api/ Mike Schroder (DH-Shredder) @GetSource - http://www.getsource.net