Skip to content

bulletproof-ajax.markdown

Latest commit

 

History

History
61 lines (49 loc) · 5 KB

bulletproof-ajax.markdown

File metadata and controls

61 lines (49 loc) · 5 KB

Bulletproof Ajax

by Jeremy Keith

I, Michael Parker, own this book and took these notes to further my own learning. If you enjoy these notes, please purchase the book!

Chapter 1: What is Ajax?

  • pg 8: A tiny, practically invisible inline frame, or hidden iframe, can get data from the server; Javascript can use that data to update the main page.
  • pg 9: Ajax isn't tied to XML -- you can use any structured format that carries data.

Chapter 2: JavaScript and the Document Object Model

  • pg 19: Variables assigned null and 0 are treated as false in boolean expressions.
  • pg 24: Use === to check if two values are not just equal but identical; use !== to check if they are not identical.
  • pg 29: Functions can be assigned to variables; to store a reference to a function with arguments defined, use an anonymous function.
  • pg 31: Functions and methods belonging to a class are called methods and properties.
  • pg 32: Native objects are part of the core Javascript language; host objects are provided by the environment in which JavaScript is running.
  • pg 39: Calling getElementsByTagName("*") returns only element nodes, while the childNodes property contains text nodes and attributes.

Chapter 3: XMLHttpRequest

  • pg 52: For XMLHttpRequest, the onreadystatechange event handler is triggered everytime the readyState property changes.
  • pg 55: The open method will not initiate a request; the send method must be invoked.
  • pg 56: If POSTing data, use the setRequestHeader method to set the Content-type header to application/x-www-form-urlencoded.
  • pg 57: Every browser finishes with a readyState value of 4 when the request is completed.
  • pg 59: If the server responds with MIME type text/xml or application/xml the response is in the responseXML property instead of responseText.

Chapter 4: Data Formats

  • pg 73: Returned XML data can be traversed using the DOM methods you would use to traverse an HTML document.
  • pg 77: JSON, pronounced like the name Jason, does not need to be interpreted by JavaScript because it is JavaScript.
  • pg 80: The JSON stored in responseText is interpreted as an object literal and converted using the eval function.
  • pg 82: The send method of XMLHttpRequest can only access the domain serving up the Javascript file being executed.
  • pg 83: Using DOM scripting, you can dynamically create a script element with a Javascript URL from another domain; that script can modify your DOM.
  • pg 89: HTML fragments returned via Ajax can be inserted wholesale into your document by assigning the innerHTML property of an element.

Chapter 5: Hijax

  • pg 98: Use the onload event handler to invoke the DOM methods in your JavaScript only once the page has finished loading.
  • pg 103: After building a web page without Ajax, apply Ajax to scenarios where a page is reloaded but only partially modified.
  • pg 112: Given a form element, its elements property contains all its inputs.
  • pg 115: Do not rely on Javascript for form validation, but use it to get and display a validation response from the server.

Chapter 6: Ajax Challenges

  • pg 124: If you're not going to try for graceful degradation, consider technologies beyond Ajax like Flash.
  • pg 126: Applications using Ajax should provide feedback to the user that some action is under way.
  • pg 130: It's also good to show that something just happened, using something like the yellow fade technique.
  • pg 136: If the user would want to bookmark the changed state of a page, don't replace full page refreshes with Ajax.
  • pg 137: With Ajax, wireframes representing web page must be ditched for prototypes that add dynamic elements through simple DOM scripting.

Chapter 7: Ajax and Accessibility

  • pg 141: Most screen readers don't interact with the DOM, but take a snapshot of the document and put it in a "virtual buffer" for manipulation.
  • pg 143: Screen readers show a bias toward the creating or updating of tables, and focusable elements like form fields and links.
  • pg 143: Assign an element a tabindex of -1 to make it focusable and attract the screen reader without upsetting the default tab order.
  • pg 144: Put an opt-in checkbox off-screen that only screen-readers can find and toggle, which generates alert messages for Ajax updates.
  • pg 149: Web browsers can't detect screen-readers, but Flash can, and can notify JavaScript of this.

Chapter 8: Putting It All Together

  • pg 171: Functions within an object can access variables declared within the same object using closures.
  • pg 182: In the onreadystatechange method, display an error message with DOM scripting if the status code is not 200 or 304.
  • pg 184: Use setTimeout to call abort on the XMLHttpRequest object if the request is taking too long, and clearTimeout if the request completes.

Chapter 9: The Future of Ajax

  • pg 193: If you use a JavaScript library, consider its file size, as the client will need to download whatever you choose.