
HTML5 Game Development Insights
Description
Alles über E-Books | Antworten auf Fragen rund um E-Books, Kopierschutz und Dateiformate finden Sie in unserem Info- & Hilfebereich.
More details
Other editions
Additional editions

Persons
Content
- Intro
- Contents at a Glance
- Contents
- About the Authors
- About the Technical Reviewers
- Introduction
- Chapter 1: JavaScript Is Not the Language You Think It Is
- Variables and Scoping Rules
- Declaration Scoping
- Declaration Hoisting
- JavaScript Typing and Equality
- Base Types
- Numbers
- Strings
- Booleans
- Objects
- Arrays
- null
- undefined
- The typeof Operator
- The instanceof Operator
- Type Coercion
- Equality Checking
- Truthiness
- Inheritance the JavaScript Way
- Prototypical Inheritance
- this
- Conclusion
- Chapter 2: Optimal Asset Loading
- Caching Data
- HTTP Caching
- HTTP Caching Example
- Loading HTTP Cached Assets
- Client-Side Storage
- Memory Caching
- Data Formats
- Texture Formats
- Audio Formats
- Other Formats
- Asset Hosting
- Server Compression
- Geolocating Assets
- Using a Content Distribution Network
- Effective Asset Grouping
- Grouping Using Tar Files
- Conclusion
- Acknowledgements
- Chapter 3: High-Performance JavaScript
- About the Demo
- Object Pools
- How to Make an Object Pool
- Pool Structure
- Recyclable Objects
- Requesting a Free Object from the Pool
- Returning Objects to the Pool
- Iterating on a Pool
- Using an Object Pool
- Updating Only What's Important
- Culling for Simulation
- Culling for Rendering
- Warming Up the Virtual Machine
- Your Code Will Be Compiled and Optimized on the Fly
- Deoptimizations
- Rev Up the Engine
- Benchmarking
- Digging Deeper
- Conclusion
- Chapter 4: Efficient JavaScript Data Structures
- The Importance of Data Structures
- Object Hierarchies
- Arrays
- Performance Data
- ArrayBuffers and ArrayBufferViews
- Complex Structures as Single ArrayBufferViews
- Late Unpacking
- Best Practices
- Conclusion
- Chapter 5: Faster Canvas Picking
- Creating Pickable Objects
- Defining a Sprite Prototype
- Representing Objects
- Basic Picking with Bounding Boxes
- Caveats
- Faster Picking via Bucketing
- Caveats
- Pixel Perfect Picking
- Loading Pixel Data
- Testing a Mouse Click
- Results and Caveats
- Convex Hull Picking
- Generating the Convex Hull
- Doing Picking Against the Convex Hull
- Caveats
- Moving Forward
- Chapter 6: Autotiles
- Shadows
- The Abyss
- Smooth Transitions
- Chapter 7: Importing Flash Assets
- Bruno Garcia, co-founder, 2DKit
- Sprite Sheets
- Vectorization
- Cutout Animation
- New Tools
- Other Assets
- Conclusion
- Chapter 8: Applying Old-School Video Game Techniques in Modern Web Games
- High-Performance Update Loops
- Calling requestAnimationFrame
- Bottlenecks in an Update Loop
- Dirty Rectangles
- Rendering Massive Grids
- Displaying Animations in Extremely Large Viewports
- Color Cycling
- Conclusion
- Chapter 9: Optimizing WebGL Usage
- The Anatomy of a WebGL Call
- How WebGL Works
- Building the Renderer
- Debugging WebGL Usage
- Using Extensions
- Vertex Array Objects
- Draw Buffers
- Instanced Arrays
- WebGL 2
- Rendering the Scene
- Frustum Culling
- Rendering Order
- Batching
- Conclusion
- Chapter 10: Playing Around with the Gamepad API
- Draft Stage
- Browser Support
- Supported Devices
- Gamepad API Implementation
- Project Setup
- Connecting the Gamepad
- Prefixes
- Detecting Disconnection
- Detecting Button Presses
- Axis Events
- Axis Threshold
- Gamepad Object
- Gamepad Differences
- Hooking Up to the Event
- Complete Source Code
- Demo Time: Hungry Fridge
- Mobile vs. Desktop
- Conclusion
- Chapter 11: Introduction to WebSockets for Game Developers
- Setting Up a WebSocket Connection
- Sending and Receiving Data
- The WebSocket API
- Creating a Simple Echo Server
- Encoding Data
- Using Socket.IO
- Getting Started
- Echo Server
- Using Events
- Scaling and Reducing Overhead
- Reducing the Size of Data Transmitted
- BSON
- MessagePack
- Intelligently Processing and Distributing Packets
- Send Mostly Deltas and Infrequent Worldviews
- Autonomous Clients/Echo Server
- Dumb Clients/Authoritative Server
- Case Studies
- GRITS
- Rawkets
- Off-the-Shelf Solutions and WebSocket-likeProducts
- Firebase
- Pusher
- Channels and Events
- Kaazing
- Conclusion
- Chapter 12: Real-Time Multiplayer Network Programming
- Introduction
- Challenges
- Bandwidth
- Latency
- Synchronization
- State Broadcast vs. Lockstep
- Dealing with Latency
- Client-Side Prediction
- Synchronized Time Among Clients
- Fast-Forwarding the Game State
- Tips and Tricks
- Keep Client Input Times Monotonically Increasing
- Keep the Game State Independent from the Rest of the Game
- Avoid Floating Point in the Game State
- Keep the Game Engine Small
- Interpolate Between Game States
- Do not Assume a Particular Sequence of Game States
- Send Checksums of the Game State
- Case Study: FrightCycle
- Getting Started
- The Game State
- Communication Between the Server and Client
- Synchronizing Time
- Server Commands
- Client-Side Prediction
- Conclusion
- Chapter 13: The State of Responsive Design
- Understanding the Problem at Hand
- Getting the Screen Dimensions
- Resolutions on the Desktop
- Resolutions on Mobile
- Responsive Canvas
- Stretch
- Float Middle
- Fit Inside Screen
- An Issue with ReadPixels
- Responsive Layout
- Responsive Content
- Working with a Cloud Computing Resource
- Conclusion
- Chapter 14: Making a Multiplatform Game
- Case Study: Funfair Freak-Out 1
- Control Method
- Performance Testing
- Interaction Design
- Physics Engine
- Audio
- Asset Sizes
- Interface Design
- Maintenance
- Conclusion
- Chapter 15: Developing Better Than Native Games
- The HTML5 Fullscreen API
- Creating a Fullscreen Button
- Losing Fullscreen and How to Handle It
- Going Further
- Lowering the Resolution
- When to Lower Resolution
- How to Lower Resolution
- Keeping Your Sprites Sharp
- Staying Sharp Using Less Pixels
- CSS Scaling
- Motion Blur
- Unwanted Behaviors
- Disabling Zoom
- Device Orientation
- Home Screen
- Icons
- Detecting Standalone
- Further References
- Android
- iOS
- Firefox OS
- Conclusion
- Chapter 16: Mobile Web Game Techniques with Canvas 2D API
- Why Canvas?
- The Basis of Canvas
- Bitmap Images and Vector Images
- A Bitmap API Example
- Path API Example
- Affine Transformations
- How to Gain Speed
- Speeding Up drawImage
- In-Memory Canvas (Offscreen Canvas)
- Dirty Rect
- Color Transformation
- Color Transformation Using Alpha
- Separate RGB Channels
- Optimization on Drawing Paths
- Use GPU Effectively
- Keeping Canvas Applications Stable
- Browser Compatibility
- Memory Problems
- Battery Problems
- Profiling on the Real Devices
- Chapter 17: Faster Map Rendering
- The MAP Object
- Fetch the Data from the Server
- Loading a Tiled Map
- Parsing the Map Data
- Rendering Tiled Data
- Understanding the Data Format to Render
- Coordinate Spaces and View-Rect
- Fast Canvas Rendering with Precaching
- Creating a CanvasTile
- Filling the Cache
- Draw!
- Sec13
- Results
- Using a Free List of Canvases
- A New CanvasTile
- Drawing the Map
- Results
- Conclusion
- Chapter 18: HTML5 Games in C++ with Emscripten
- What is Emscripten?
- How Emscripten Works
- Clang
- Emscripten
- Memory Representation
- Arithmetic
- What is asm.js?
- The Emscripten Toolchain
- Graphics Support
- WebGL
- Canvas
- Audio Support
- Input Events
- Performance
- Debugging
- A Game Port
- Choosing a Game
- Getting Emscripten
- Building the Game
- Third-Party Dependencies and a Real Build System
- Loading Game Content
- Getting the Game to Run
- Integrating with OpenGL, Attempt #1: Regal
- Integrating with OpenGL, Attempt #2: Simplifying the AstroMenace Renderer
- The Main Loop
- The Emscripten Platform
- Predicting the Future
- Chapter 19: Introduction to TypeScript: Building a Rogue-like Engine
- What Is TypeScript?
- Language Overview
- Setting Up TypeScript
- Creating Your Game Class
- Drawing to Canvas
- Handling Movement
- Extending Your Engine
- Adding Enemies and Treasure
- Rendering Sprites
- Rendering Larger Maps
- Chapter 20: Implementing a Main Loop in Dart
- Sample Code
- Dart
- game_loop
- Interfacing with the Browser
- Inputs
- Time
- Display Sync
- User Input
- Outputs
- Game State
- Display
- Audio
- Your First Main Loop and What's Wrong with It
- Quest for Determinism
- Fixed Time Step
- Accumulating Time
- Falling Behind
- Seeing into the Future
- User Input
- Timers
- Rendering
- On Demand
- Interpolation
- User Input Processing
- Digital Input
- Analog Input
- Positional Input
- Game-Specific Code
- Chords
- Sequences
- Conclusion
- Chapter 21: Saving Bandwidth and Memory with WebGL and Crunch
- The Goal
- Browser-Supported Images
- BMP
- GIF
- PNG
- JPEG
- WEBP
- Memory Use
- Compressed Textures
- Loading DDS Files
- Crunch
- Emscripten
- Workers
- Notes on dxt-util.js
- Conclusion
- Chapter 22: Creating a Two-Dimensional Map Editor
- List of Tiles
- List of Sprites
- Basic Tileset Configuration
- Binding Sprites to Tiles
- Map Field and Its Serialization to JSON
- Camera
- Renderer
- Editor
- Builder Window
- Main Window
- index.html with jQuery UI
- Conclusion
- Chapter 23: Automating Your Workflow with Node.js and Grunt
- Automating Your Workflow
- Installing Node.js
- Command-Line Primer
- Introduction to npm
- Installing Grunt
- Creating a Grunt File
- What Should Your Build Script Do?
- Conclusion
- Chapter 24: Building a Game with the Cocos2d-html5 Library
- What Is Cocos2d?
- Why Was Cocos2d Created?
- What Makes Cocos2d the Best Choice for Your 2D Game Development?
- What Sets Cocos2d Apart from Other Similar Frameworks?
- What Is Cocos2d-html5?
- Why Was Cocos2d-html5 Created?
- What Are the Main Differences in Cocos2d and Cocos2d-html5?
- Extending the Power of Cocos2d-html5 with Cocos2d JavaScript Binding
- Understanding Cocos2d
- Basic Concepts of Cocos2d
- Director
- Scene
- Layer
- Sprite
- Coordinate System
- Action
- Animation
- Scheduler
- Touch Event
- Introduction to the Directory Structure
- Introduction to the Tiled Editor
- What is TMX?
- Why Tiled Editor?
- Getting Started on Built-in Examples
- Review the Built-in Examples
- Review the Tests
- Taking a Look at the Sample Games
- MoonWarriors
- Fruit Attack
- Setting Up Your First "Hello World" Project
- Building the Tower Defence Game
- Overview
- The Tower Defence Gameplay Scene
- Designing the Required Game Components
- A Step-by-Step Process for Making the Tower Defence Game
- Creating the Tower Defence Project
- Creating Main Menu Scene for the Game
- Creating the Game Layer, Toolbar Layer, and Game Map Layer
- Adding the Enemy Menu and the Show Range of the Game
- Creating Towers and Bullets
- Creating Enemies and Actions
- Simple Collision Detection
- Adding Music and Sound Effects
- Creating the Game Over Scene
- Deploying the Game
- Releasing a Cocos2d-html5 App to a Native App
- The Power of Distributing an HTML5 Game as a Native Package
- Setting Up the Cocos2d JSB Environment
- Adding Resources to the Project
- Configuring the Project
- Building for iOS
- Learning More
- How Active Is the Community?
- Many Top Games Are Created with Cocos2d
- What If I Have a Question?
- Conclusion
- Index
System requirements
File format: PDF
Copy protection: Watermark-DRM (Digital Rights Management)
System requirements:
- Computer (Windows; MacOS X; Linux): Use the free software Adobe Reader, Adobe Digital Editions, or any other PDF viewer of your choice (see eBook Help).
- Tablet/Smartphone (Android; iOS): Install the free app Adobe Digital Editions or another reading app for eBooks, e.g., PocketBook (see eBook Help).
- E-reader: Bookeen, Kobo, Pocketbook, Sony, Tolino and many more (only limited: Kindle).
The file format PDF always displays a book page identically on any hardware. This makes PDF suitable for complex layouts such as those used in textbooks and reference books (images, tables, columns, footnotes). Unfortunately, on the small screens of e-readers or smartphones, PDFs are rather annoying, requiring too much scrolling.
This eBook uses Watermark-DRM, a „soft” copy protection. This means that there are no technical restrictions to prevent illegal distribution. However, there is a personalised watermark embedded in the eBook that can be used to identify the purchaser of the eBook in the event of misuse and to provide evidence for legal purposes.
For more information, see our eBook Help page.