2

In development our rails app runs slow. When working on javascript, previewing in the browser is a pain because of some of the slow response times. Is there a way to have the browser simply reprocess the request, and still load fresh assets, without re-requesting the page itself?

Ideal solution is in chrome or firefox.

Thanks.

chrishomer
  • 4,900
  • 5
  • 38
  • 52
  • It's not clear what the problem is. Is it a network issue? Can you use fake data and test the JavaScript in isolation? Can you use localStorage? Are you trying to load these "fresh assets" via ajax without having the entire page reload? – wlangstroth Apr 16 '11 at 21:41
  • I am trying to reprocess the last page request on the client. The only requests that should hit the server are css, javascript and image calls. This is purely meant to be a way to work with css and javascript and not have to re-request the html everytime I refresh. – chrishomer Apr 17 '11 at 19:45
  • Are you saying you want to dynamically reload js and css and then have the browser re-render the page without reloading html (new dom) from server? – splonk Apr 18 '11 at 17:05

7 Answers7

2

Generally what you can do is take advantage of the cache. As long as the server is providing correct Last-Modified, ETag, Expires and Cache-Control headers the browser should not re-request that URL unless you press F5 in the browser.

For example you could load your application in a IFRAME or old-school FRAME and add some JavaScript code that quickly navigates away from the page and then returns to the same URL. This forces the browser to reload the URL from cache and reinterpret it.

Of course you shoule make sure that the URL is reloaded from the server after you made changes (like adding a version number to the URL query string or something like that).

Unfortunately browser caching is not always possible to predict exactly.

Hope this helps.

Udo G
  • 12,572
  • 13
  • 56
  • 89
  • Not quite what I'm looking for. Thought there might be an api level way to trigger a reprocess of the page contents without hitting the server for the html or anything else - it's not a caching issue. – chrishomer Apr 13 '11 at 15:52
  • 1
    "trigger a reprocess of the page contents without hitting the server for the html" -- that's exactly what caching is for. Why doesn't caching solve the problem? – Tyler Apr 13 '11 at 23:25
  • You could try to save `document.innerHTML` in the onLoad event and restore that property to have the browser reprocess the page. Not sure if that solves your problem. Anyway AFAIK there is no native API call to have the browser reprocess the page (and it doesn't make much sense after all). – Udo G Apr 15 '11 at 09:57
1

I am thinking about several possibles solutions here :

Maybe the simpliest one is to save whole page to an html file (File/Save as in browser), and put the resulting HTML page on the server in the same context. With this solution you have no problem with same domain policy. You might require to prefetch data at least one time or to have an active session for your user, but that's all. Oviously this will not work if the heavy work is with ajax requests.

Second solution is to use a web server (like apache), to serve as a proxy for your application server. You use a different domain or context to ensure you don't cache the normal application but only in a domain reserved to UI/design testing. It is then possible to fine tune what will be cached or not (ajax requests, html, css...). When you want to force a refresh you simply empty your cache. Using a proxy allow you to not modify default application behaviour

Nicolas Bousquet
  • 3,990
  • 1
  • 16
  • 18
1

Ok, how about grabbing the DOM elements (maybe by using jquery contents() function) and saving it to browser local storage. Then reload the js and css using something like this (from Can't append <script> element and I've seen similar syntax work on Facebook js dynamic load)

var script = document.createElement( 'script' );
script.type = 'text/javascript';
script.src = url;
$("#someElement").append( script );

Once js and css is reloaded then replace DOM elements with value from browser local storage.

Have not tried this but it seems like the strategy could work.

Community
  • 1
  • 1
splonk
  • 1,045
  • 6
  • 11
0

It sounds like you need ajax. When you request the page in the browser, the full page normally loads - it interrupts your user's process and it takes time. If you use ajax, only some of the page reloads:

browser       ajax      server
  |            |         |
  |--js event->|         |
  |            |--HTTP-->|
  |            |<--data--|
  |<--handler--|         |

Your ruby code only has to return the part of the data that is new - sometimes even just "OK" or "error", like for example for a login. Meawhile, since ajax is really javascript, your user doesn't see an interruption: new data is brought in while they are still reading or continuing to fill the form.

boisvert
  • 3,679
  • 2
  • 27
  • 53
  • Not what I am looking for, I use ajax of course. What I am looking to do is simply get the browser to reprocess the entire response it received and reload stylesheets and javascript. – chrishomer Apr 13 '11 at 15:51
0

I just had a little poke around the internet and came across a firefox plug-in called CSS Refresh Which looks like it can refresh your css without loading the page, but I haven't tried it so not sure if it works.

For your javascript, you could fire your events / functions that usually trigger on load etc - manually using a javascript console (e.g. the firebug command line).

I'm sure there are better ways, but at least it looks like it's possible.

Alex KeySmith
  • 16,657
  • 11
  • 74
  • 152
0

Web Developer toolbar for FF or Chrome and Pendule for Chrome all have the ability to reload CSS and JS from the source without reloading the HTML.

rivenate247
  • 2,116
  • 2
  • 16
  • 18
0

You could use Fiddler. It's an HTTP proxy that runs locally on your machine and provides you an easy log of all traffic that goes through it (kind of like what the net tab in Firebug does). It has an option to auto-respond to URLs matching a given pattern. So, you could:

  1. Make your initial request to the rails app, wait for it to finish.
  2. Save the response to an HTML file locally
  3. Setup an auto-responder for that URL to respond with the local file instead.

So, now the browser thinks it's making a round trip to the server, but fiddler is intercepting the request and returning the same static content.

Mike Ruhlin
  • 3,546
  • 2
  • 21
  • 31