Data Push Apps with HTML5 SSE

Preface

The modern Web is a demanding place. You have to look good. You have to load fast. And you have to have good, relevant, interesting, up-to-date content. This book is about a technology to help with the second and third of those: making sure people using your website or web application are getting content that is bang up-to-date. Minimal latency, no compromises.

This is also a book that cares about practical, real-world applications. Sure, Chapter 2 is based around a toy example, as are the introductory examples in Chapters 6 and 7. But the rest of the book is based around complete applications that don’t shy away from the prickly echidnas that occupy the corner cases the real world will throw at us.

The Kind of Person You Need to Be

You need to be strong yet polite, passionate yet objective, and nice to children, the elderly, and Internet cats alike. However, this book is less demanding than real life. I’m going to assume you know your HTML (HyperText Markup Language) from your HTTP (HyperText Transport Protocol), and that you also know the difference between HTML, CSS (Cascading Style Sheets), and JavaScript. To understand the client-side code you should at least be able to read and understand basic JavaScript. (When more complex JavaScript is used, it will be explained in a sidebar or appendix.)

On the server side, the book has been kept as language-neutral as possible. Most code is introduced with simple PHP code, because PHP is quite short and expressive for this kind of application. As long as you know any C-like language you will have no trouble following along, but if you get stuck, please see Appendix C, which introduces some aspects of the PHP language. Chapter 2 also shows the example in Node.js. In later chapters, if the code gets a bit PHP-specific, I also show you how to do it in some other languages.

Finally, to follow along with the examples it is assumed you have a web server such as Apache installed on your development machine. On many Linux systems it is already there, or very simple to install. For instance, on Ubuntu, sudo apt-get install lamp-server will install Apache, PHP, and MySQL in one easy step. On Windows, XAMPP is a similar all-in-one package that will give you everything you need. There is also a Mac version.

Organization of This Book

The core elements of SSE are not that complex: Chapter 2 shows a fully working example (both frontend and backend) in just a few pages. Before that, Chapter 1 will give some background on HTML5, data push, potential applications, and alternative technologies.

From Chapter 3 through Chapter 7 we build a complete application, trying to be as realistic as possible while also trying really hard not to bore you with irrelevant detail. The domain of this application is financial data. Chapter 3 is the core application. Chapter 4 refactors and expands on it. Chapter 5 deals with the awkward details that turn up when we try to make a data push application, things like complex data, data sources going quiet, and sockets dying on us. Chapter 6 introduces one way (long-polling) to get our application working on desktop and mobile browsers that are not yet supporting SSE, and then Chapter 7 shows two other ways that are superior but not available on all browsers. Chapter 3 also spends some time developing realistic, repeatable data that our sample application can push. Though not directly about SSE, it is a very useful demonstration of designing for testability in data push applications.

Chapter 8 covers some elements of the SSE protocol that we chose not to use in the realistic application that was built up in the other chapters. And, yes, the reasons why they were not used is also given. That leads into Chapter 9, where all the security issues (cookies, authorization, CORS) that were glossed over in earlier chapters are finally covered.

Conventions Used in This Book

The following typographical conventions are used in this book:

Italic

Indicates new terms, URLs, email addresses, filenames, and file extensions.

Constant width

Used for program listings, as well as within paragraphs to refer to program elements such as variable or function names, databases, data types, environment variables, statements, and keywords.

Constant width bold

Shows commands or other text that should be typed literally by the user.

Constant width italic

Shows text that should be replaced with user-supplied values or by values determined by context.

Tip

This element signifies a tip or suggestion.

Note

This element signifies a general note.

Caution

This element indicates a warning or caution.

Using Code Examples

The source files used and referred to in the book are available for download at https://github.com/DarrenCook/ssebook.

This book is here to help you get your job done. In general, if example code is offered with this book, you may use it in your programs and documentation. You do not need to contact us for permission unless you’re reproducing a significant portion of the code. For example, writing a program that uses several chunks of code from this book does not require permission. Selling or distributing a CD-ROM of examples from O’Reilly books does require permission. Answering a question by citing this book and quoting example code does not require permission. Incorporating a significant amount of example code from this book into your product’s documentation does require permission.

We appreciate, but do not require, attribution. An attribution usually includes the title, author, publisher, and ISBN. For example: “Data Push Apps with HTML5 SSE by Darren Cook (O’Reilly). Copyright 2014 Darren Cook, 978-1-449-37193-7.”

If you feel your use of code examples falls outside fair use or the permission given above, feel free to contact us at [e-mail].

Safari® Books Online

Note

Safari Books Online (www.safaribooksonline.com) is an on-demand digital library that delivers expert content in both book and video form from the world’s leading authors in technology and business.

Technology professionals, software developers, web designers, and business and creative professionals use Safari Books Online as their primary resource for research, problem solving, learning, and certification training.

Safari Books Online offers a range of product mixes and pricing programs for organizations, government agencies, and individuals. Subscribers have access to thousands of books, training videos, and prepublication manuscripts in one fully searchable database from publishers like O’Reilly Media, Prentice Hall Professional, Addison-Wesley Professional, Microsoft Press, Sams, Que, Peachpit Press, Focal Press, Cisco Press, John Wiley & Sons, Syngress, Morgan Kaufmann, IBM Redbooks, Packt, Adobe Press, FT Press, Apress, Manning, New Riders, McGraw-Hill, Jones & Bartlett, Course Technology, and dozens more. For more information about Safari Books Online, please visit us online.

How to Contact Us

Please address comments and questions concerning this book to the publisher:

O’Reilly Media, Inc.

1005 Gravenstein Highway North

Sebastopol, CA 95472

800-998-9938 (in the United States or Canada)

707-829-0515 (international or local)

707-829-0104 (fax)

We have a web page for this book, where we list errata, examples, and any additional information. You can access this page at http://oreil.ly/data-push-apps-html5-sse.

To comment or ask technical questions about this book, send email to [e-mail].

For more information about our books, courses, conferences, and news, see our website at http://www.oreilly.com.

Find us on Facebook: http://facebook.com/oreilly

Follow us on Twitter: http://twitter.com/oreillymedia

Watch us on YouTube: http://www.youtube.com/oreillymedia