You are previewing HTML5 Game Development Insights.
O'Reilly logo
HTML5 Game Development Insights

Book Description

HTML5 Game Development Insights is a from-the-trenches collection of tips, tricks, hacks, and advice straight from professional HTML5 game developers. The 24 chapters here include unique, cutting edge, and essential techniques for creating and optimizing modern HTML5 games. You will learn things such as using the Gamepad API, real-time networking, getting 60fps full screen HTML5 games on mobile, using languages such as Dart and TypeScript, and tips for streamlining and automating your workflow. Game development is a complex topic, but you don't need to reinvent the wheel. HTML5 Game Development Insights will teach you how the pros do it.

The book is comprised of six main sections: Performance; Game Media: Sound and Rendering; Networking, Load Times, and Assets; Mobile Techniques and Advice; Cross-Language JavaScript; Tools and Useful Libraries. Within each of these sections, you will find tips that will help you work faster and more efficiently and achieve better results.

Presented as a series of short chapters from various professionals in the HTML5 gaming industry, all of the source code for each article is included and can be used by advanced programmers immediately.

What you'll learn

  • "From The Trenches" tips, hacks, and advice on HTML5 game development

  • Best practices for building Mobile HTML5 games

  • Actionable advice and code for both professional and novices

  • Who this book is for

    HTML5 Game Development Insights is for the game developer looking to improve their development process at all stages of the game development pipeline; The nuggets of awesome in this book are applicable both to the hobbyist, trying to track down a performance bug in rendering, and the professional, who is looking to speed up loading time by re-packing their artist-generated images. With this book, it's like looking over the shoulder of the top HTML5 game developers!

    Table of Contents

    1. Title Page
    2. Contents at a Glance
    3. Contents
    4. About the Authors
    5. About the Technical Reviewers
    6. Introduction
    7. CHAPTER 1: JavaScript Is Not the Language You Think It Is
      1. Variables and Scoping Rules
      2. JavaScript Typing and Equality
      3. Inheritance the JavaScript Way
      4. Conclusion
    8. CHAPTER 2: Optimal Asset Loading
      1. Caching Data
      2. Data Formats
      3. Asset Hosting
      4. Effective Asset Grouping
      5. Conclusion
      6. Acknowledgements
    9. CHAPTER 3: High-Performance JavaScript
      1. About the Demo
      2. Object Pools
      3. Updating Only What’s Important
      4. Warming Up the Virtual Machine
      5. Conclusion
    10. CHAPTER 4: Efficient JavaScript Data Structures
      1. The Importance of Data Structures
      2. Object Hierarchies
      3. Arrays
      4. Performance Data
      5. ArrayBuffers and ArrayBufferViews
      6. Complex Structures as Single ArrayBufferViews
      7. Late Unpacking
      8. Best Practices
      9. Conclusion
    11. CHAPTER 5: Faster Canvas Picking
      1. Creating Pickable Objects
      2. Basic Picking with Bounding Boxes
      3. Faster Picking via Bucketing
      4. Pixel Perfect Picking
      5. Convex Hull Picking
    12. CHAPTER 6: Autotiles
      1. Shadows
      2. The Abyss
      3. Smooth Transitions
    13. CHAPTER 7: Importing Flash Assets
      1. Sprite Sheets
      2. Vectorization
      3. Cutout Animation
      4. New Tools
      5. Other Assets
      6. Conclusion
    14. CHAPTER 8: Applying Old-School Video Game Techniques in Modern Web Games
      1. High-Performance Update Loops
      2. Dirty Rectangles
      3. Rendering Massive Grids
      4. Displaying Animations in Extremely Large Viewports
      5. Color Cycling
      6. Conclusion
    15. CHAPTER 9: Optimizing WebGL Usage
      1. The Anatomy of a WebGL Call
      2. Conclusion
    16. CHAPTER 10: Playing Around with the Gamepad API
      1. Draft Stage
      2. Gamepad API Implementation
      3. Demo Time: Hungry Fridge
      4. Conclusion
    17. CHAPTER 11: Introduction to WebSockets for Game Developers
      1. Setting Up a WebSocket Connection
      2. Sending and Receiving Data
      3. The WebSocket API
      4. Encoding Data
      5. Using Socket.IO
      6. Scaling and Reducing Overhead
      7. Case Studies
      8. Off-the-Shelf Solutions and WebSocket-likeProducts
      9. Conclusion
    18. CHAPTER 12: Real-Time Multiplayer Network Programming
      1. Introduction
      2. Case Study: FrightCycle
      3. Conclusion
    19. CHAPTER 13: The State of Responsive Design
      1. Understanding the Problem at Hand
      2. Getting the Screen Dimensions
      3. Responsive Canvas
      4. Responsive Layout
      5. Responsive Content
      6. Conclusion
    20. CHAPTER 14: Making a Multiplatform Game
      1. Case Study: Funfair Freak-Out
      2. Control Method
      3. Performance Testing
      4. Interaction Design
      5. Physics Engine
      6. Audio
      7. Asset Sizes
      8. Interface Design
      9. Maintenance
      10. Conclusion
    21. CHAPTER 15: Developing Better Than Native Games
      1. The HTML5 Fullscreen API
      2. Lowering the Resolution
      3. Keeping Your Sprites Sharp
      4. Unwanted Behaviors
      5. Home Screen
      6. Conclusion
    22. CHAPTER 16: Mobile Web Game Techniques with Canvas 2D API
      1. Why Canvas?
      2. The Basis of Canvas
      3. How to Gain Speed
      4. Keeping Canvas Applications Stable
      5. Profiling on the Real Devices
    23. CHAPTER 17: Faster Map Rendering
      1. The MAP Object
      2. Fetch the Data from the Server
      3. Loading a Tiled Map
      4. Fast Canvas Rendering with Precaching
      5. Draw!
      6. Conclusion
    24. CHAPTER 18: HTML5 Games in C++ with Emscripten
      1. What is Emscripten?
      2. How Emscripten Works
      3. What is asm.js?
      4. The Emscripten Toolchain
      5. A Game Port
      6. The Emscripten Platform
      7. Predicting the Future
    25. CHAPTER 19: Introduction to TypeScript: Building a Rogue-like Engine
      1. What Is TypeScript?
      2. Language Overview
      3. Setting Up TypeScript
      4. Creating Your Game Class
      5. Drawing to Canvas
      6. Handling Movement
      7. Extending Your Engine
    26. CHAPTER 20: Implementing a Main Loop in Dart
      1. Sample Code
      2. Interfacing with the Browser
      3. Your First Main Loop and What’s Wrong with It
      4. Quest for Determinism
      5. User Input Processing
      6. Conclusion
    27. CHAPTER 21: Saving Bandwidth and Memory with WebGL and Crunch
      1. The Goal
      2. Browser-Supported Images
      3. Memory Use
      4. Compressed Textures
      5. Loading DDS Files
      6. Crunch
      7. Emscripten
      8. Workers
      9. Notes on dxt-util.js
      10. Conclusion
    28. CHAPTER 22: Creating a Two-Dimensional Map Editor
      1. List of Tiles
      2. List of Sprites
      3. Basic Tileset Configuration
      4. Binding Sprites to Tiles
      5. Map Field and Its Serialization to JSON
      6. Camera
      7. Renderer
      8. Editor
      9. Builder Window
      10. Main Window
      11. index.html with jQuery UI
      12. Conclusion
    29. CHAPTER 23: Automating Your Workflow with Node.js and Grunt
      1. Automating Your Workflow
      2. Conclusion
    30. CHAPTER 24: Building a Game with the Cocos2d-html5 Library
      1. What Is Cocos2d?
      2. What Is Cocos2d-html5?
      3. Understanding Cocos2d
      4. Introduction to the Directory Structure
      5. Introduction to the Tiled Editor
      6. Getting Started on Built-in Examples
      7. Setting Up Your First “Hello World” Project
      8. Building the Tower Defence Game
      9. Overview
      10. Releasing a Cocos2d-html5 App to a Native App
      11. Setting Up the Cocos2d JSB Environment
      12. Learning More
      13. How Active Is the Community?
      14. What If I Have a Question?
      15. Conclusion
    31. Index