#169 Dynamic Page Caching

Jul 06, 2009 | 11 minutes | Caching, Performance, Ajax, Administration

Use JavaScript to allow dynamic content in a page cache. In this episode I show you how to insert the user-specific content into a page through JavaScript.

Click to Play Video ▶

Download:
source codeProject Files in Zip (117 KB)
mp4Full Size H.264 Video (17.9 MB)
m4vSmaller H.264 Video (12.2 MB)
webmFull Size VP8 Video (31.9 MB)
ogvFull Size Theora Video (25.9 MB)

Browse Source Code

Resources

          bash
                
        rm public/index.html.erb
        
rm public/index.html.erb

          config/environments/development.rb
                
        config.action_controller.perform_caching = true
        
config.action_controller.perform_caching = true

          forums_controller.rb
                
        caches_page :index

def index
  @forums = Forum.all
  sleep 2
end
        
caches_page :index

def index
  @forums = Forum.all
  sleep 2
end

          layouts/application.html.erb
                
        <%= render 'layouts/dynamic_header' unless @hide_dynamic %>
        
<%= render 'layouts/dynamic_header' unless @hide_dynamic %>

          forums/index.html.erb
                
        <% title "Piano Forums" %>
<% javascript "jquery", "/users/current" %>
<% @hide_dynamic = true %>

<div id="forums">
  <% for forum in @forums %>
    <div class="forum">
      <h2><%= link_to h(forum.name), forum %></h2>
      <p><%=h forum.description %></p>
      <p class="admin" style="display:none">
        <%= link_to "Edit", edit_forum_path(forum) %> |
        <%= link_to "Destroy", forum, :confirm => 'Are you sure?', :method => :delete %>
      </p>
    </div>
  <% end %>
</div>

<p class="admin" style="display:none"><%= link_to "New Forum", new_forum_path %></p>
        
        
        
        
        
        
        
        
        
      
<% title "Piano Forums" %>
<% javascript "jquery", "/users/current" %>
<% @hide_dynamic = true %>

<div id="forums">
  <% for forum in @forums %>
    <div class="forum">
      <h2><%= link_to h(forum.name), forum %></h2>
      <p><%=h forum.description %></p>
      <p class="admin" style="display:none">
        <%= link_to "Edit", edit_forum_path(forum) %> |
        <%= link_to "Destroy", forum, :confirm => 'Are you sure?', :method => :delete %>
      </p>
    </div>
  <% end %>
</div>

<p class="admin" style="display:none"><%= link_to "New Forum", new_forum_path %></p>

          users/show.js.erb
                
        $(document).ready(function() {
  $("#container").prepend('<%=escape_javascript render("layouts/dynamic_header") %>');
  <% if admin? %>
    $(".admin").show();
  <% end %>
});
        
$(document).ready(function() {
  $("#container").prepend('<%=escape_javascript render("layouts/dynamic_header") %>');
  <% if admin? %>
    $(".admin").show();
  <% end %>
});