3

In some of my pages I have "templates". For example, I might have a table, and I have a "template" for each row in the table

<div class="wholeRow"><div class="lefCol"><!-- some stuff will go here --></div>...

Then I use JS to fill out this table. It's a bit silly though that the user has to load this template every single time they visit the page - I should be able to cache it.

I'm not sure how to go about caching it though; the only thing I can think of is put it in a static javascript file and wrap it all with document.write, but that seems kind of, well, stupid. Does anyone have other ideas?

Xodarap
  • 11,581
  • 11
  • 56
  • 94

1 Answers1

1

If it is a content that does not change dynamically between page loads, it should be generated on server, not by Javascript. If it is a dynamic content, it makes no sense to cache it.

I would first think about your application design and then about advanced caching.

Caching things on the client is mainly handled by the browser (and they are handled pretty well nowadays). If you want to cache results computed by Javascript, you have two storage possibilities:

  1. Cookies
  2. HTML5 API for storing JS data

None of them is perfect for this purpose as none of them was designed for caching. For now I would go for Cookies as these are widely supported. After loading your page, simply check if a cookie exists and if so, just display its contents. Otherwise generate it using JS.

On a side note - don't use <div> for tabular data. The <table> element was designed for that.

Community
  • 1
  • 1
Karel Petranek
  • 15,005
  • 4
  • 44
  • 68
  • This seems weird to me; do people really put html data in cookies? That seems really bad. I would essentially have to manually control the cache instead of letting the browser do it. Also: the template is static, but what gets put in the template isn't. I'm not putting "results computed by javascript" anywhere, I'm just storing some html (which is generated by the server). – Xodarap Sep 29 '10 at 16:45
  • Then you do not have to do anything. The browser will cache anything that comes from the server (generally). I thought that "Then I use JS to fill out this table." means that you use some kind of JS computation to fill the table with data and want to cache the table with the filled data. – Karel Petranek Sep 29 '10 at 17:20
  • I don't think I'm being very clear. The entire page is dynamic - it can't be cached. however *portions* of the page can be cached. How do I cache some portions of this page? If the portions were js or css or images, I could put them in separate files with cache-control headers. How can I do this with html? – Xodarap Sep 29 '10 at 17:36
  • That's pretty difficult and the browsers are not (yet?) ready for such a scenario. If the site runs smoothly even without caching, I wouldn't dive into this. To say it simply, there are no built-in caching methods in HTML itself, if you want some you have to code them using either of the approaches mentioned in my answer. – Karel Petranek Sep 29 '10 at 17:43
  • hmmm. That's too bad, but I guess if you can't do it, you can't do it. – Xodarap Sep 29 '10 at 17:49