Forum: Ruby on Rails Pass data to javascript

Hi!

I'm creating a bar graph using Morris.js. What I'm showing in the graph 
is
dates on the X-axis and the number of times an event has occurred on 
that
date on the Y-axis.

So, I followed Ryan Bates episode on
Morris.js: http://railscasts.com/episodes/223-charts-graphs-revised 
(It's a
PRO episode so I will explain more).

I created a class method in my model that fetches all records, groups by
date and count the occurrences. This method is called by a helper method
from my view. The helper method loops over the date range and checks the
number of occurrences for that date and adds it to a hash (dates that
doesn't exist in the database is set to 0).
This hash is then simply added to my view as a data attribute
(data-events="{....}") which I'm fetching using JS and adding to the 
graph.

The questions I have are:
- Is this a good approach?
- Would it be better to add another action to my controller and have 
that
return the data needed as JSON and call just this using javascript?

What are the benefits/drawbacks of the different approaches?

Another option would be to fetch the raw JSON data using javascript from
.../events.json and then do the grouping and whatever client-side and 
pass
to the graph... Maybe too inefficient?

// Linus


Den fredagen den 25:e januari 2013 kl. 10:35:40 UTC+1 skrev Linus
Pettersson:

Hey,
      The approach of adding data-attributes and letting JavaScript to
fetch it and play around  is good as you have kept your view and js away
from each other. But rememeber the entire page+all the raw data of 
events
is rendered in a single http request. This will be fine if the raw data 
is
not heavy.
But as Linus suggested you can Ajax end point which will be called by 
the
JavaScript So the page rendering will be fast as the first request will 
be
the one which will render the entire HTML and layout while charts will 
be
rendered via Ajax in the subsequent requests.

Linus Pettersson wrote in post #1093722:
> I created a class method in my model that fetches all records, groups by
> date and count the occurrences. This method is called by a helper method
> from my view. The helper method loops over the date range and checks the
> number of occurrences for that date and adds it to a hash (dates that
> doesn't exist in the database is set to 0).
> This hash is then simply added to my view as a data attribute
> (data-events="{....}") which I'm fetching using JS and adding to the
> graph.
>
> The questions I have are:
> - Is this a good approach?
> - Would it be better to add another action to my controller and have
> that
> return the data needed as JSON and call just this using javascript?
>
> What are the benefits/drawbacks of the different approaches?

Generally speaking try to avoid pre-mature optimization.

1. Go with the simplest solution that could possibly work.

2. Gather some metrics.

3. Try a different approach that you think might improve performance.

4. Goto step 2 until step 3 is exhausted.

Robert Walker wrote in post #1094237:

>> What are the benefits/drawbacks of the different approaches?
>
> Generally speaking try to avoid pre-mature optimization.
>
> 1. Go with the simplest solution that could possibly work.
>
> 2. Gather some metrics.
>
> 3. Try a different approach that you think might improve performance.
>
> 4. Goto step 2 until step 3 is exhausted.

Oh! Forgot to mention that Ryan Bates also created an episode that might 
be useful for you.

http://railscasts.com/episodes/324-passing-data-to...