Darren Cook
Data Push Apps with HTML5 SSE
Data Push Apps with HTML5 SSE
by Darren Cook
Copyright © 2014 Darren Cook. All rights reserved.
Printed in the United States of America.
Published by O’Reilly Media, Inc., 1005 Gravenstein Highway North, Sebastopol, CA 95472.
O’Reilly books may be purchased for educational, business, or sales promotional use. Online editions are
also available for most titles (http://my.safaribooksonline.com). For more information, contact our corporate/
institutional sales department: 800-998-9938 or corporate@oreilly.com.
Editors: Simon St. Laurent and Allyson MacDonald
Production Editor: Kristen Brown
Copyeditor: Kim Cofer
Proofreader: Charles Roumeliotis
Indexer: Lucie Haskins
Cover Designer: Karen Montgomery
Interior Designer: David Futato
Illustrator: Rebecca Demarest
March 2014:
First Edition
Revision History for the First Edition:
2014-03-17: First release
See http://oreilly.com/catalog/errata.csp?isbn=9781449371937 for release details.
Nutshell Handbook, the Nutshell Handbook logo, and the O’Reilly logo are registered trademarks of O’Reilly
Media, Inc. Data Push Apps with HTML5 SSE, the image of a short-beaked echidna, and related trade dress
are trademarks of O’Reilly Media, Inc.
Many of the designations used by manufacturers and sellers to distinguish their products are claimed as
trademarks. Where those designations appear in this book, and O’Reilly Media, Inc. was aware of a trademark
claim, the designations have been printed in caps or initial caps.
While every precaution has been taken in the preparation of this book, the publisher and authors assume
no responsibility for errors or omissions, or for damages resulting from the use of the information contained
herein.
ISBN: 978-1-449-37193-7
[LSI]
Table of Contents
Preface. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . vii
1.
All About SSE...And Then Some. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 1
HTML5 2
Data Push 2
Other Names for Data Push 6
Potential Applications 6
Comparison with WebSockets 7
When Data Push Is the Wrong Choice 9
Decisions, Decisions… 11
Take Me to Your Code! 13
2.
Super Simple Easy SSE. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 15
Minimal Example: The Frontend 15
Using JQuery? 19
Minimal Example: The Backend 20
The Backend in Node.js 22
Minimal Web Server in Node.js 22
Pushing SSE in Node.js 23
Now to Get It Working in a Browser! 25
Smart, Sassy Exit 27
3.
A Delightfully Realistic Data Push Application. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 29
Our Problem Domain 29
The Backend 30
The Frontend 35
Realistic, Repeatable, Random Data 36
Fine-Grained Timestamps 39
Taking Control of the Randomness 42
iii