Advanced Ajax Architecture and Best Practices

Total Page:16

File Type:pdf, Size:1020Kb

Advanced Ajax Architecture and Best Practices Advanced Ajax Architecture and Best Practices Shawn M. Lauriat Upper Saddle River, NJ • Boston • Indianapolis • San Francisco New York • Toronto • Montreal • London • Munich • Paris • Madrid Cape Town • Sydney • Tokyo • Singapore • Mexico City Many of the designations used by manufacturers and sellers to distinguish their products are Editor-in-Chief claimed as trademarks. Where those designations appear in this book, and the publisher was Mark Taub aware of a trademark claim, the designations have been printed with initial capital letters or in all capitals. Acquisitions Editor Debra Williams Cauley The author and publisher have taken care in the preparation of this book, but make no expressed or implied warranty of any kind and assume no responsibility for errors or omissions. No liability Development Editor is assumed for incidental or consequential damages in connection with or arising out of the use of Michael Thurston the information or programs contained herein. Managing Editor The publisher offers excellent discounts on this book when ordered in quantity for bulk purchases Gina Kanouse or special sales, which may include electronic versions and/or custom covers and content particu- Project Editor lar to your business, training goals, marketing focus, and branding interests. For more informa- tion, please contact: Anne Goebel U.S. Corporate and Government Sales Copy Editor (800) 382-3419 Jill Batistick [email protected] Indexer For sales outside the United States, please contact: Erika Millen International Sales Proofreader [email protected] Water Crest Publishing Technical Reviewers Jason Ellis Eric Foster-Johnson Chris Shifl ett Publishing Coordinator Heather Fox Cover Designer Gary Adair Composition codeMantra Visit us on the Web: www.informit.com/title/9780131350649 Library of Congress Cataloging-in-Publication Data: Lauriat, Shawn M. Advanced Ajax : architecture and best practices / Shawn M. Lauriat. p. cm. ISBN 0-13-135064-1 (pbk. : alk. paper) 1. Ajax (Web site development technology) I. Title. TK5105.8885.A52L38 2007 006.7--dc22 2007030306 Copyright © 2008 Pearson Education, Inc. All rights reserved. Printed in the United States of America. This publication is protected by copyright, and permission must be obtained from the publisher prior to any prohibited reproduction, storage in a retrieval system, or transmission in any form or by any means, electronic, mechanical, photocopying, recording, or likewise. For information regarding permissions, write to: Pearson Education, Inc. Rights and Contracts Department 75 Arlington Street, Suite 300 Boston, MA 02116 Fax: (617) 848-7047 ISBN-13: 978-0-13-135064-9 ISBN-10: 0-13-135064-1 Text printed in the United States on recycled paper at Courier Stoughton in Stoughton, Massachusetts. First printing October 2007 Contents Acknowledgments ......................................................................................................... xiii About the Author ............................................................................................................xv Introduction ............................................................................................... 1 0.1 Ajax, the Acronym .............................................................................. 2 0.1.1 Asynchronous.......................................................................... 3 0.1.2 JavaScript ................................................................................3 0.1.3 XML .......................................................................................4 0.2 This Book’s Intentions ........................................................................ 5 0.3 Prerequisites for This Book ................................................................. 8 Chapter 1 Usability ................................................................................................11 1.1 Interface Versus Showcase .................................................................12 1.1.1 Implementation ....................................................................14 1.2 User Expectations .............................................................................16 1.3 Indicators and Other Forms of User Feedback .................................. 17 1.3.1 The Throbber ........................................................................17 1.3.2 Progress Indicators ................................................................20 1.3.3 Keeping the User in the Loop ................................................22 1.4 Semantic Markup .............................................................................30 1.4.1 More Accessible .....................................................................30 1.4.2 Easier to Use ......................................................................... 32 vii viii Contents 1.4.3 Easier to Maintain .................................................................33 1.4.4 Easier to Parse ....................................................................... 34 1.5 What CSS and JavaScript Have in Common .................................... 37 Chapter 2 Accessibility ..........................................................................................43 2.1 WCAG and Section 508 ...................................................................44 2.1.1 WCAG ................................................................................ 45 2.1.2 Section 508 ...........................................................................51 2.2 Screen Readers Can Handle Ajax ...................................................... 53 2.2.1 Content Replacement ...........................................................54 2.2.2 Form Validation ....................................................................55 2.3 Unobtrusive Ajax ..............................................................................56 2.4 Designing with Accessibility in Mind ................................................58 2.4.1 High-Contrast Design ...........................................................59 2.4.2 Zoomable Interface ...............................................................60 2.4.3 Easily Targeted Controls ........................................................62 2.5 WAI-ARIA ........................................................................................63 Chapter 3 Client-Side Application Architecture ....................................................67 3.1 Objects and Event Triggering ............................................................68 3.1.1 Native Object Event Handling ..............................................70 3.1.2 JavaScript Objects .................................................................71 3.2 Model-View-Controller Design Pattern ............................................ 87 3.2.1 The Model ............................................................................88 3.2.2 The View ..............................................................................92 3.2.3 The Controller ....................................................................101 3.3 Event-Driven Application Development ......................................... 104 3.3.1 Advantages of Architecture ..................................................104 Contents ix Chapter 4 Debugging Client-Side Code ..............................................................107 4.1 Validation, Validation, Validation ....................................................108 4.1.1 Markup Validator ................................................................109 4.1.2 CSS Validator ......................................................................110 4.1.3 Semantic Extractor ..............................................................111 4.2 Browser Tools and Plugins .............................................................. 111 4.2.1 The Console ........................................................................112 4.2.2 Internet Explorer .................................................................113 4.2.3 Firefox .................................................................................116 4.2.4 Opera ..................................................................................122 4.2.5 Safari ...................................................................................124 4.3 JavaScript Profiling .........................................................................126 4.3.1 Recognizing Bottlenecks ......................................................128 4.4 Unit Testing ....................................................................................132 4.4.1 Assertions ............................................................................134 4.4.2 Test Setup ............................................................................135 4.4.3 The Test Itself ......................................................................137 4.4.4 Mock Objects ......................................................................140 4.4.5 Test Suites ...........................................................................143 Chapter 5 Performance Optimization ..................................................................145 5.1 Database Performance .....................................................................146 5.1.1 Schema ...............................................................................146 5.1.2 Queries ...............................................................................150 5.2 Bandwidth and Latency .................................................................
Recommended publications
  • RH Summit--Zimbra-UWM, Sept 2009
    Freeing the Desktop and your Data Center with a Next Generation Email and Collaboration Platform Andy Pflaum Bruce Maas VP Bus. Development, CIO, Zimbra Univ. of Wisconsin- Milwaukee 1 Red Hat Summit 2009 | Andy Pflaum (Zimbra) & Bruce Maas (UW-Milwaukee) Zimbra Overview The Open Source Leader in Messaging & Collaboration • Mail, Calendar, Contacts, Web Docs, Archiving & Discovery…. • Web services mash-ups with 3rd party applications (VoIP, ERP, CRM etc.) What Differentiates Zimbra • 35-50% better TCO than MS Exchange and Lotus Domino • Best cross-platform support (mobile, desktop, OS, browser….) • Rich integration capabilities • Clear open source leader in the category − 1M+ downloads of Zimbra server; 3M+ Zimbra Desktop downloads − 27,000+ registered community members • Market validation − 3,500+ customers and 52M+ paid mailboxes in 90+ countries − 450 hosting partners and 250 resellers (60% of Zimbra business) − Gartner Rating: ‘Positive’, May 2009, Email Systems Marketscope 2 Red Hat Summit 2009 | Andy Pflaum (Zimbra) & Bruce Maas (UW-Milwaukee) Zimbra App & Client Support iPhone ActiveSync or xHTML Zimbra zSync Server Zimbra Sync ActiveSync phones Ajax Web Client Win Mobile Palm Symbian zSync iSync & MAPI CalDAV IMAP, POP, CalDAV, iCal, RSS MS Outlook Apple Desktop Standards Clients BES BlackBerry 3 Red Hat Summit 2009 | Andy Pflaum (Zimbra) & Bruce Maas (UW-Milwaukee) Zimbra Customers in 90+ Countries Large Business Sinclair Broadcasting SMB & SME Education Service South Providers (Sprint LEC) Africa Australia 4 Red Hat Summit 2009 | Andy Pflaum (Zimbra) & Bruce Maas (UW-Milwaukee) What is Zimbra Desktop? • Provides the same user experience offline & online, cross-browser/OS • 2-way sync of all messages, meetings, contacts etc.
    [Show full text]
  • 2010 Survey Results
    IT SERVICES 2010 Client Satisfaction Survey March, 2010 Acknowledgements The Stanford IT Services Client Satisfaction Team consisted of the following: Jan Cicero, Client Support Alvin Chew, Communication Services Liz Goesseringer, Business Services Tom Goodrich, Client Support Jim Knox, Facilitator, Client Support Phil Reese, Research Computing Nancy Ware, Strategic Planning Bryan Wear, Computing Services Brian McDonald, MOR Associates Chris Paquette, MOR Associates Alexis Bywater, MOR Associates MOR Associates, an external consulting firm, acted as project manager for this effort, analyzing the data and preparing this report. MOR Associates specializes in continuous improvement, strategic thinking and leadership development. MOR Associates has conducted a number of large-scale satisfaction surveys for IT organizations in higher education, including MIT, Northeastern University, the University of Chicago, and others. MOR Associates, Inc. 462 Main Street, Suite 300 Watertown, MA 02472 tel: 617.924.4501 fax: 617.924.8070 morassociates.com Brian McDonald, President [email protected] Contents Introduction. a1 Methodology . a2 Overview.of.the.Results . 1 Reading.the.Charts. 25 Customer.Service.and.Service.Attributes. 29 Research.Computing.and.IT.Services.Priorities. .33 General.Support. .41 Data.Storage.Services .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. .. ..51 Email.and.Webmail. 59 Calendaring. 63 Network.Services. 67 Telecommunications.Services. 73 Remote.Access . 83 Mobile.Devices . 87 Software. .89 Security. 93 Web.Services. 99 Appendix.A:.The.Full.Text.of.Written.Comments. .A-1 Appendix.B:.The.Survey.Instrument. B-. 1 Appendix.C:.Other.Observations . .C-1 Stanford Information Technology Services 2010 Client Survey • Introduction | a1 Introduction This report provides a summary of the purposes, the methodology and the results of the client satisfaction survey sponsored by Stanford Information Technology Services in March, 2010.
    [Show full text]
  • The Desktop (Overview)
    The desktop (overview) The desktop is the main screen area that you see after you turn on your computer and log on to Windows. Like the top of an actual desk, it serves as a surface for your work. When you open programs or folders, they appear on the desktop. You can also put things on the desktop, such as files and folders, and arrange them however you want. The desktop is sometimes defined more broadly to include the taskbar and Windows Sidebar. The taskbar sits at the bottom of your screen. It shows you which programs are running and allows you to switch between them. It also contains the Start button , which you can use to access programs, folders, and computer settings. On the side of the screen, Sidebar contains small programs called gadgets. The desktop, taskbar, and Sidebar Where did my desktop go? Because programs run on top of the desktop, the desktop itself is often partially or completely hidden. But it's still there, underneath everything. To see the whole desktop without closing any of your open programs or windows, click the Show Desktop button on the taskbar. The desktop is revealed. Click the icon again to restore all of your windows to the way they were. Desktop Training Session Handout Page 1 http://ict.maxwell.syr.edu/vista/ Working with desktop icons Icons are small pictures that represent files, folders, programs, and other items. When you first start Windows, you'll see at least one icon on your desktop: the Recycle Bin (more on that later).
    [Show full text]
  • Zimbra™ Collaboration Suite Multi-Server Installation Guide
    Zimbra™ Collaboration Suite Multi-Server Installation Guide Release 6.0 Network Edition Legal Notices Copyright 2005-2010 Zimbra. All rights reserved. No part of this document may be reproduced, in whole or in part, without the express written permission of Zimbra. Trademark and Licensing MySQL is a registered trademark of MySQL AB in the United States, the European Union and other countries. OpenLDAP is a registered trademark of the OpenLDAP Foundation. Postfix is copyright © 1999 International Business Machines Corporation and others and it was created by Wietse Venema <[email protected]>. SpamAssassin is a trademark of Deersoft, Inc. This product includes software developed by the Apache Software Foundation (http://www.apache.org/). All other marks are the property of their respective owners. Building Better Products within the Open Source Community Zimbra Collaboration Suite leverages many great technologies from the open source community: MySQL, OpenLDAP, Postfix, SpamAssassin, and Apache. Zimbra believes that great products come from contributing to and leveraging open source technologies. We are thankful for the great contributions that led to the creation of MySQL, OpenLDAP, Postfix, SpamAssassin, and Apache software. ------------------------------------------------------------------------------------------------------- Zimbra, a division of VMware, Inc. 3401 Hillview Avenue Palo Alto, California 94304 USA www.Zimbra.com September 2009 ZCS 6.0 Rev 4 (6.0.8) 7/2010 Table of Contents Chapter 1 Introduction . 5 Audience . 5 Zimbra Collaboration Suite License . 5 For More Information . 5 Support and Contact Information . 6 Chapter 2 Planning for the Installation . 7 Zimbra Packages . 7 Configuration Examples . 8 Downloading the Zimbra Software . 9 Zimbra License . 10 Menu-Driven Configuration . 10 Common configuration options .
    [Show full text]
  • Bforartists UI Redesign Design Document Part 2 - Theming
    Bforartists UI redesign Design document part 2 - Theming Content Preface...........................................................................................................................6 The editor and window types......................................................................................7 Python console.............................................................................................................8 Layout:................................................................................................................................................................8 The Console Window.........................................................................................................................................8 Menu bar with a menu........................................................................................................................................8 Dropdown box with icon....................................................................................................................................9 RMB menu for menu bar....................................................................................................................................9 Toolbar................................................................................................................................................................9 Button Textform..................................................................................................................................................9
    [Show full text]
  • Navigate Windows and Folders
    Windows® 7 Step by Step by Joan Preppernau and Joyce Cox To learn more about this book, visit Microsoft Learning at http://www.microsoft.com/MSPress/books/ 9780735626676 ©2009 Joan Preppernau and Joyce Cox Early Content—Subject to Change Windows 7 Step by Step Advance Content–Subject to Change Windows 7 Step by Step Draft Table of Contents Overview Front Matter ............................................................................................................................................. 3 Contents ................................................................................................................................................ 3 About the Authors ................................................................................................................................ 3 Features and Conventions of This Book ................................................................................................ 3 Using the Companion CD ...................................................................................................................... 3 Getting Help .......................................................................................................................................... 3 Introducing Windows 7 ......................................................................................................................... 3 Part I: Getting Started with Windows 7 .................................................................................................... 4 1 Explore Windows 7 ...........................................................................................................................
    [Show full text]
  • Editing the Home Screen Widgets:
    Brisbane German Club WordPress Website Manual 1 Table of Contents How To Add: A Page .............................................................................................................. 3 How To Edit: A Page .............................................................................................................. 4 How To Add: A Post ............................................................................................................... 8 How To Edit: A Post ............................................................................................................. 12 How To Edit: Home Page ..................................................................................................... 13 Editing the Home Screen Widgets: ....................................................................................... 19 How To Change: The Menu .................................................................................................. 22 Events & Calendar ............................................................................................................... 24 How To Add: a Hyperlink ..................................................................................................... 26 2 How To Add: A Page Step 1: Go to „Pages‟ on the left sidebar of the backend. Click „Add New‟ 3 How To Edit: A Page Step 1: Hold the cursor over any specific page. 4 options appear – to edit/ quick edit/ trash/ view. These are self-explanatory however to edit a page select the edit function or alternatively just click on
    [Show full text]
  • Review Interface Quick Reference
    Review Interface Review Interface Features Viewer type tabs Select which Viewer type you would like to view the current document in. Viewer Displays the current document in the selected Viewer. Document navigation Browse across documents in the Review queue. 9 6 8 1 2 3 Coding layouts Customizable coding forms for viewing and editing a document’s fields. 7 Related items card Identify and act on documents related to the active document. Document list List presentation of all the documents in the user’s Review queue. Viewer settings Menu of display configurations and review settings. 4 Keyboard Shortcut Displays the keyboard shortcuts legend. Legend Enable/Disable Turns keyboard shortcuts on or off. Keyboard Shortcuts Show/Hide Tab Strip Display or hide the Sidebar and Tab strip in the Viewer. Pop Out Viewer Select to open the Pop Out Viewer in a new browser window. Select to move the Coding Layout and the Document card to the opposite Swap Layout side of the Viewer from where they are currently located. Document Actions Menu of actions the user may perform on the document as a whole. 5 Download document Download the native file for the current document. Alternatively, you can native click on the document’s name to download the native. Copy document link Select to copy the URL to the current document to your clipboard. Select to open an email in your default email application with the URL to the Email document current document included in the body of the email. Replace document Select to replace the native file of the current document with a new file native Hover your cursor over this option and Image Profile options will display.
    [Show full text]
  • Vigil Client 10 | User's Guide
    Client 10 Remote Desktop Client Software User Guide Revised: June 1st, 2017 3xLOGIC Inc. ©2017 COPYRIGHT AND LEGAL NOTICES|VIGIL CLIENT 10 | USER'S GUIDE VIGIL Copyright ©2017 3xLOGIC, Inc. All rights reserved. 3xLOGIC Inc. 210-10385 Westmoor Drive Westminster, CO 80021 United States (303) 430-1969 Disclaimer Information in this document is subject to change without notice and does not represent a commitment on the part of 3xLOGIC Inc. The soft- ware and /or databases described in this document are furnished under a license agreement or nondisclosure agreement. They may be used or copied only in accordance with the terms of the agreement. It is against the law to copy the software on any medium except as specifically allowed in the license or nondisclosure agreement. The purchaser may make one copy of the software for backup purposes. No part of this manual and /or databases may be reproduced or transmitted in any form or by any means, electronic or mechanical, including (but not limited to) photocopying, recording, or information storage and retrieval systems, for any purpose other than the purchaser's personal use, without the express written permission of 3xLOGIC Inc. 3xLOGIC, VIGIL and AZTECH are trademarks of 3xLOGIC, Inc. Other trademarks and trade names may be used in this document to refer to either the entities claiming the marks and names or their products. 3xLOGIC Inc. disclaim any proprietary interest in trademarks and trade names other than their own. TABLE OF CONTENTS|VIGIL CLIENT 10 | USER'S GUIDE Table of Contents 1 Introduction
    [Show full text]
  • Downloadable Email Program for My Pc 32 Best Free Email Clients
    downloadable email program for my pc 32 Best Free Email Clients. Here are 32 best free email client software . These let you manage and access all of your email accounts in one single place easily. All these email client software are completely free and can be downloaded to Windows PC. These free software offer various features, like: can be used with IMAP, SMTP, POP3 and Gmail, keeps your emails safe and secure, lets you open various emails simultaneously, provide protection from spam, lets you view your emails offline, manage and access all of your email accounts in one single place, supports PH, LDAP, IMAP4, POP3 and SMPT mail protocols etc. So, go through this list of free email client software and see which ones you like the most. Thunderbird. Thunderbird is a free and handy email client software for your computer. It can be used with IMAP, SMTP, POP3 and Gmail. It will also work with email accounts provided by MS Exchange Server. The user interface of Thunderbird is tabbed. It lets you open various emails simultaneously. Thunderbird keeps your emails safe and secure. It also has special filters for filtering the mail. Windows Live Mail. Windows Live Mail is a free email client for your computer. It works with various email accounts. It lets you access Yahoo, Gmail, Hotmail and emails from different servers which supports POP3 and SMTP. Its security features are excellent it will also provide protection from spam. You can also view your emails offline in this freeware. Zimbra Desktop. Zimbra Desktop is a free email client.
    [Show full text]
  • Line 6 POD Go Owner's Manual
    ® 16C Two–Plus Decades ACTION 1 VIEW Heir Stereo FX Cali Q Apparent Loop Graphic Twin Transistor Particle WAH EXP 1 PAGE PAGE Harmony Tape Verb VOL EXP 2 Time Feedback Wow/Fluttr Scale Spread C D MODE EDIT / EXIT TAP A B TUNER 1.10 OWNER'S MANUAL 40-00-0568 Rev B (For use with POD Go Firmware 1.10) ©2020 Yamaha Guitar Group, Inc. All rights reserved. 0•1 Contents Welcome to POD Go 3 The Blocks 13 Global EQ 31 Common Terminology 3 Input and Output 13 Resetting Global EQ 31 Updating POD Go to the Latest Firmware 3 Amp/Preamp 13 Global Settings 32 Top Panel 4 Cab/IR 15 Rear Panel 6 Effects 17 Restoring All Global Settings 32 Global Settings > Ins/Outs 32 Quick Start 7 Looper 22 Preset EQ 23 Global Settings > Preferences 33 Hooking It All Up 7 Wah/Volume 24 Global Settings > Switches/Pedals 33 Play View 8 FX Loop 24 Global Settings > MIDI/Tempo 34 Edit View 9 U.S. Registered Trademarks 25 USB Audio/MIDI 35 Selecting Blocks/Adjusting Parameters 9 Choosing a Block's Model 10 Snapshots 26 Hardware Monitoring vs. DAW Software Monitoring 35 Moving Blocks 10 Using Snapshots 26 DI Recording and Re-amping 35 Copying/Pasting a Block 10 Saving Snapshots 27 Core Audio Driver Settings (macOS only) 37 Preset List 11 Tips for Creative Snapshot Use 27 ASIO Driver Settings (Windows only) 37 Setlist and Preset Recall via MIDI 38 Saving/Naming a Preset 11 Bypass/Control 28 TAP Tempo 12 Snapshot Recall via MIDI 38 The Tuner 12 Quick Bypass Assign 28 MIDI CC 39 Quick Controller Assign 28 Additional Resources 40 Manual Bypass/Control Assignment 29 Clearing a Block's Assignments 29 Clearing All Assignments 30 Swapping Stomp Footswitches 30 ©2020 Yamaha Guitar Group, Inc.
    [Show full text]
  • Zimbra Tips & Tricks
    TOP ZIMBRA 15 TIPS & TRICKS This guide brings you the top 15 Zimbra Tips & Tricks to help you save time while working in Zimbra. If you find these Tips & Tricks helpful, you may also like our tutorial demos: The top 15 Zimbra Tips & Tricks (based on clicks on Zimbra’s “Did You Know?” blog) are: Throughout this guide, look for pop-up boxes highlighting quick tips Email Tips and Tricks and facts. 1 Searching in Zimbra TIP: Skip ahead to any 2 Importing Into and Exporting From Zimbra section of the 15 Tips & 3 Changing Your Zimbra Preferences Tricks by clicking on the 4 Changing Your Zimbra Theme titles to the right. 5 Setting Zimbra Email and SMS (text) Reminders 6 Enabling Zimbra’s Mandatory Spellcheck 7 Sorting Email 8 Creating an Appointment with the Mini Calendar 9 Creating an Email Distribution List or Contact Group 10 Opening an Email in a Separate Window 11 Turning on Zimbra’s Activity Stream 12 Switching from Conversation View to Message View 13 Sharing Your Zimbra Calendar Outside Your Organization 14 Sharing in Zimbra 15 Enabling Zimbra Two-Factor Authentication 1 Searching in Zimbra There are many great and easy ways to search in Zimbra: • Quick keyword search • Complex search • Right-click search Quick Keyword Search You can do a quick search using keywords like from, to, in, etc. Click here to see all search keywords. How much time do you spend searching To search by keyword: for a specific email? keyword: search word(s) Searches are easy and fast in Zimbra. Search Examples: your entire Zimbra • Find all email received from Mark (all email with “Mark” in the From account, including attachments, in seconds.
    [Show full text]