Someone having tabs with Seaside html+js cached on localStorage?

Mariano Martinez Peck <[email protected]>
Newsgroups gmane.comp.lang.smalltalk.squeak.seaside
Message-ID <CAA+-=mV1+rj7LVg3G9EKL7i9NCetYaQj9yf+Xo4Uy-DfLyRhkQ@mail.gmail.com>
Hi guys,

I have an application which is tabbed based...that is, there is a main menu
and each menu item opens a new tab in a "workspace". The user can then go
to different tabs. Right now, every single click on a tab, does an ajax
request and re-renders the "tab contents area". I hate this approach
because even if the tab/component hasn't changed anything, every single tab
click is a request + re-rendering. Sometimes the tabs are quite some heavy
components which takes some time to render. So the application feels slow
even when simply moving around tabs.

To workaround that I was thinking to cache in localStorage each tabs html
and then on each click of the tab, do a html() of the "tab contents area"
to the html cached for that tab.

That seemed like a good idea but after start trying to implement it, and I
found quite some problems already. The main problem is that <scripts>
embedded in the html of the tab. That JS is re-executed when I do:

$(''.workspaceTabContents'').empty().html(localStorage[''tabContents'' +
clickedTabId ]);

And that is bad because each time I click on a tab, the JS is executed
again and I have side effects. I could workaround this by stripping the
<scripts> out. But then i have other problems.

For example, I use bootstrap-select for my selects. When you do
$(''.selectpicker'').selectpicker();   that alters the original HTML. So
when you click on another tab and you must saved latest HTML of the
currently selected tab, :

localStorage[''tabContents'' + previousActiveTabId ] =
$(''.workspaceTabContents'').html();

it is the already modified HTML. Yet it has the JS...so it would duplicate
my selects...

And this is just to begin with....

Another idea I had is to NOT cache on localStorage on client side but on
server side. So that is, if a user clicks on a tab and does the ajax
request, I do not re-render the component in Seaside (avoid all cost of
#renderContentOn: etc) but instead  answered a cached HTML+JS.  Of course,
here I still pay request, network, etc, but at least I avoid HTML
generation.


So I wonder...has anyone ever did something like this? Note that at the
moment I cannot afford going with a client-side UI like angular or
whatever.

Thanks in advance,

-- 
Mariano
http://marianopeck.wordpress.com

_______________________________________________
seaside mailing list
[email protected]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside
lmpx.com only provides a reader for public news (NNTP) servers. It is not affiliated with the servers or forums shown here and is not responsible for the content of articles, which is written by their respective authors.