In this chapter we focus on cases 1 and 2 keeping the following best practices

In this chapter we focus on cases 1 and 2 keeping the

This preview shows page 205 - 207 out of 517 pages.

In this chapter we focus on cases 1 and 2 , keeping the following best practices in mind: Graceful degradation: In Case 1 , a site’s user experience should be acceptable even in the absence of JavaScript. (Displaying the message “JavaScript is required for this site” doesn’t count.) The more positive-sounding term progressive enhancement emphasizes the benefit of adding JavaScript rather than the penalty of omitting it. Why should you care about this? One reason is compatibility: according to Microsoft , 24% of Chinese Internet users in 2013—over 130 million people—still use Internet Explorer 6, which has serious JavaScript compatibility problems. Another reason is that JavaScript may be disabled for security reasons, especially in enterprise environments where users cannot change their own configuration settings. We refer to all these cases as legacy browsers, and we insist that our app remain usable in the absence of JavaScript. Obviously, this guideline doesn’t apply to Case 2 , since JavaScript is required for SPAs. Unobtrusive: JavaScript code should be kept completely separate from page markup. In both cases, this helps separate concerns as we did with Model–View–Controller. In Case 1 , it also simplifies supporting legacy browsers. Figure 6.1 compares our exposition of server-side and client-side programming. Screencast 6.1.1 demonstrates the two JavaScript features we will add to RottenPotatoes in this chapter. Server Client Language Ruby JavaScript Framework Rails jQuery Client- Server Architecture over HTTP Controller receives request, interacts with model, renders new page (view) Controller receives request, interacts with model, and renders a partial or an XML- or JSON-encoded object, which is used by JavaScript code running in browser to modify current page in place Debugging Ruby debugger, rails console Firebug, browser’s JavaScript console Testing RSpec with rspec-rails ; isolate tests from database using ActiveRecord model fixtures and factories Jasmine, jasmine-jquery ; isolate tests from server using HTML and JSON fixtures Figure 6.1: The correspondence between our exposition of server-side programming with Ruby and Rails and client-side programming with JavaScript continues our focus on productively creating DRY, concise code that is well covered by tests. Screencast 6.1.1: Adding JavaScript features to RottenPotatoes We will first add a checkbox that allows filtering the RottenPotatoes movie list to exclude films unsuitable for children. This behavior can be implemented entirely in client-side JavaScript using techniques described in Sections 6.4 and 6.5 . Next we will change the behavior of the “More info” link
Image of page 205
for each movie to display the extra info in a “floating” window rather than loading a new page. This will require AJAX, since fetching the movie info requires communicating with the server. Section 6.6 introduces AJAX programming. Both behaviors will be implemented with graceful degradation so that legacy browsers still have a good experience.
Image of page 206
Image of page 207

You've reached the end of your free preview.

Want to read all 517 pages?

  • Spring '19
  • Dr.Marcos

What students are saying

  • Left Quote Icon

    As a current student on this bumpy collegiate pathway, I stumbled upon Course Hero, where I can find study resources for nearly all my courses, get online help from tutors 24/7, and even share my old projects, papers, and lecture notes with other students.

    Student Picture

    Kiran Temple University Fox School of Business ‘17, Course Hero Intern

  • Left Quote Icon

    I cannot even describe how much Course Hero helped me this summer. It’s truly become something I can always rely on and help me. In the end, I was not only able to survive summer classes, but I was able to thrive thanks to Course Hero.

    Student Picture

    Dana University of Pennsylvania ‘17, Course Hero Intern

  • Left Quote Icon

    The ability to access any university’s resources through Course Hero proved invaluable in my case. I was behind on Tulane coursework and actually used UCLA’s materials to help me move forward and get everything together on time.

    Student Picture

    Jill Tulane University ‘16, Course Hero Intern

Stuck? We have tutors online 24/7 who can help you get unstuck.
A+ icon
Ask Expert Tutors You can ask You can ask You can ask (will expire )
Answers in as fast as 15 minutes
A+ icon
Ask Expert Tutors