Smalltalk › Frameworks & Tools › Seaside › Seaside General

How to avoid too many callbacks

_‹ Previous Topic Next Topic _›

Classic

List

Threaded

6 messages Options

Gerhard Obermann

How to avoid too many callbacks

Hi!

What is the best way to avoid too many callbacks!

I have a large table with e.g. 1000 cells.

Each cell has an onClick Event with a callback.

But to improve the performance, it would be

better to use only one callback which sends back the selected cell id as parameter!

It would be nice to have an example for such cases.

Gerhard

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

Lukas Renggli

Re: How to avoid too many callbacks

> What is the best way to avoid too many callbacks!

JavaScript.

> I have a large table with e.g. 1000 cells.
> Each cell has an onClick Event with a callback.
> But to improve the performance, it would be
> better to use only one callback which sends back the selected cell id as
> parameter!

You register single callback that passes an id of the selected cell to
the callback. Possibly the JsonParser I just submitted to the Seaside
repository might help you here to establish a simple protocol between
the client and the server side.

Lukas

--
Lukas Renggli
http://www.lukas-renggli.ch
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

Gerhard Obermann

Re: How to avoid too many callbacks

Thanks Lukas,

I made a working example, but i want to know if it is possible to simplify it.

BTW the test result shows a good performance gain without the 100 callbacks.

Render Time (with 100 callbacks) : 29 ms

Render Time (with 1 callback) : 6 ms

File Size (with 100 callbacks): 20736

File Size (with 1 callback): 8611

renderContentOn: html
html heading: 'Callback Test'.

html script: 'function showCell(cellid) {',
((html updater id: 'result'; callback: [:r | self renderResultOn: r];
callback: [:v | self result: v] value: (SUStream new nextPutAll: 'cellid'))) printString, '}'.

  1 to: 100 do: [:idx | html anchor id: 'id_', idx asString;
       onClick: 'showCell(this.id)';
       with: idx. html space.
       idx \\ 20 = 0 ifTrue: [html break]].

html break.

html div id: 'result'; with: [self renderResultOn: html]

Gerhard

On Thu, May 1, 2008 at 10:53 AM, Lukas Renggli <[hidden email]> wrote:

> What is the best way to avoid too many callbacks!

JavaScript.

> I have a large table with e.g. 1000 cells.
> Each cell has an onClick Event with a callback.
> But to improve the performance, it would be
> better to use only one callback which sends back the selected cell id as
> parameter!

You register single callback that passes an id of the selected cell to
the callback. Possibly the JsonParser I just submitted to the Seaside
repository might help you here to establish a simple protocol between
the client and the server side.

Lukas

--
Lukas Renggli
http://www.lukas-renggli.ch
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

Lukas Renggli

Re: How to avoid too many callbacks

> I made a working example, but i want to know if it is possible to simplify it.

Instead of defining a global function showCell and hardcoding the
onclick handler in the html for every cell you could iterate over the
elements in question (in this case that would be the anchors that have
the CSS class clickable):

html selector
add: 'a.clickable';
do: [ :each | each element on: 'click' do: (html updater ...) ]

> BTW the test result shows a good performance gain without the 100 callbacks.
>
> Render Time (with 100 callbacks) : 29 ms
>
> Render Time (with 1 callback) : 6 ms
> File Size (with 100 callbacks): 20736
> File Size (with 1 callback): 8611

Good ;-)

Cheers,
Lukas

--
Lukas Renggli
http://www.lukas-renggli.ch
_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

Sophie424

Re: How to avoid too many callbacks

In reply to this post by Gerhard Obermann

"Gerhard Obermann" <[hidden email]> wrote in message

> BTW the test result shows a good performance gain without the 100
> callbacks.
>
> Render Time (with 100 callbacks) : 29 ms
> Render Time (with 1 callback) : 6 ms
> File Size (with 100 callbacks): 20736
> File Size (with 1 callback): 8611

Wow, looks like I could do this in some places in my app. Any chance you
could share the rest of this test/sample code?

Always amazed by how much I do not know :)

- Sophie

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

Gerhard Obermann

Re: Re: How to avoid too many callbacks

Hi!

Its already a fully working example!

Now with the simplification suggested by Lukas!

renderContentOn: html
html heading: 'Callback Test'.

  1 to: 100 do: [:idx | html anchor id: 'id_', idx asString;
       class: 'showCell';
       with: idx. html space.
       idx \\ 20 = 0 ifTrue: [html break]].
html break.
html div id: 'result'; with: [self renderResultOn: html].

self session addLoadScript: (html selector
      add: 'a.showCell';
    do: [ :each | each element on: 'click' do: (html evaluator callback: [:script | script element id: 'result'; update: [:r | self renderResultOn: r]];
      callback: [:v | self result: v] value: (SUStream new nextPutAll: 'this.id'))]).

cheers

Gerhard

On Thu, May 1, 2008 at 6:39 PM, itsme213 <[hidden email]> wrote:

"Gerhard Obermann" <[hidden email]> wrote in message

> BTW the test result shows a good performance gain without the 100
> callbacks.
>
> Render Time (with 100 callbacks) : 29 ms
> Render Time (with 1 callback) : 6 ms
> File Size (with 100 callbacks): 20736
> File Size (with 1 callback): 8611

Wow, looks like I could do this in some places in my app. Any chance you
could share the rest of this test/sample code?

Always amazed by how much I do not know :)

- Sophie

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside

_______________________________________________
seaside mailing list
[hidden email]
http://lists.squeakfoundation.org/cgi-bin/mailman/listinfo/seaside