< Return to Video

RailsConf 2014 - Where did the OO go? Views Should be Objects Too!

  • 0:17 - 0:20
    ANDREW WARNER: Welcome. I an Andrew Warner.
  • 0:20 - 0:22
    I am the director of engineering at
  • 0:22 - 0:25
    RapGenius dot com. You can follow me
  • 0:25 - 0:28
    on Twitter at wwarner. And you can also
  • 0:28 - 0:31
    follow RapGenius on Twitter at RapGenius.
  • 0:31 - 0:33
    So Tweet at me during the presentation,
  • 0:33 - 0:35
    after the presentation, tomorrow.
  • 0:35 - 0:38
    Whatever. I'm down. I will respond to your
    stuff.
  • 0:38 - 0:41
    So, this is really exciting for me. This is
  • 0:41 - 0:44
    my first RailsConf speaking. And so, you know,
    I'm
  • 0:44 - 0:48
    super excited to be here. Come on. Little
    round
  • 0:48 - 0:50
    of applause. Yeah. Yeah.
  • 0:50 - 0:53
    This is very exciting for me, not just because
  • 0:53 - 0:56
    I'm speaking, but also because you all, you
    know,
  • 0:56 - 0:58
    this is a pretty full room. You all chose
  • 0:58 - 1:00
    my talk over the other two talks! This is,
  • 1:00 - 1:01
    you know, it makes me feel good. It also
  • 1:01 - 1:04
    is crazy, because, how do you even know what
  • 1:04 - 1:06
    I'm gonna be talking about? I had some summary
  • 1:06 - 1:08
    that's kind of vague. Like, maybe I'm gonna
    say
  • 1:08 - 1:09
    some stuff, but, you know, maybe I'm gonna
    change
  • 1:09 - 1:11
    it a little bit. Now I've got this slide
  • 1:11 - 1:12
    on the screen that says Rails Holy Grail.
    Who
  • 1:12 - 1:15
    knows what that even means? So, you know,
    I'm
  • 1:15 - 1:17
    excited that you chose me even besides all
    this
  • 1:17 - 1:18
    stuff.
  • 1:18 - 1:21
    So, you know, I'm gonna be talking today about
  • 1:21 - 1:22
    the Rails Holy Grail. I'm a little bit disappointed
  • 1:22 - 1:25
    that DHH kind of stole my thunder with his
  • 1:25 - 1:27
    Holy Grail slide. But, you know, I, I still,
  • 1:27 - 1:29
    I'm gonna use it. I couldn't find another
    replacement
  • 1:29 - 1:32
    Holy Grail slide in the meantime.
  • 1:32 - 1:34
    So, I guess, what am I gonna be telling
  • 1:34 - 1:37
    you about? Well, first, I'm gonna be talking
    to
  • 1:37 - 1:38
    you about what the Holy Grail is. So what
  • 1:38 - 1:41
    I mean when I say the Holy Grail. I'm
  • 1:41 - 1:43
    gonna be showing you some existing Rails solutions
    that
  • 1:43 - 1:46
    kind of get us close to this. I'm going
  • 1:46 - 1:48
    to be offering up a new solution for your
  • 1:48 - 1:52
    consideration today. And I'm gonna show you
    what else
  • 1:52 - 1:55
    this new solution gets us.
  • 1:55 - 1:59
    So, first off, what is the Holy Grail of
  • 1:59 - 2:01
    the web? This background is like the song
    Holy
  • 2:01 - 2:04
    Grail by Jay-Z. I don't know. So, the Holy
  • 2:04 - 2:06
    Grail of the web, what I actually mean when
  • 2:06 - 2:09
    I say Holy Grail, is the best possible user
  • 2:09 - 2:14
    experience combined with the best possible
    developer experience. So
  • 2:14 - 2:16
    it should be very easy for me to rapidly
  • 2:16 - 2:19
    develop an application, as a developer, that
    is also
  • 2:19 - 2:23
    easy to use for a user.
  • 2:23 - 2:25
    And so what is the best possible user experience?
  • 2:25 - 2:29
    Well, I'm talking about sort of a, a single-page
  • 2:29 - 2:31
    app thick client feel. So you shouldn't have
    to
  • 2:31 - 2:35
    reload the entire page every time you, every
    time
  • 2:35 - 2:37
    the user actually clicks on a link. So in
  • 2:37 - 2:39
    2004, when Rails came out, it was really great
  • 2:39 - 2:42
    because it allowed you to create, very quickly,
    websites
  • 2:42 - 2:45
    which were kind of a thin client, where every
  • 2:45 - 2:46
    single click reloaded the whole page.
  • 2:46 - 2:48
    And this was revolutionary. Before that, you
    know, it
  • 2:48 - 2:51
    was really difficult to make a site rapidly.
    And
  • 2:51 - 2:54
    around the same time, actually, Google released
    this Gmail
  • 2:54 - 2:56
    thing. Kind of hard to see the screenshot,
    but
  • 2:56 - 2:59
    I think you're all familiar with what Gmail
    actually
  • 2:59 - 3:02
    is. Gmail was this single-page app where every
    single
  • 3:02 - 3:05
    click actually loaded right on the same page
    that
  • 3:05 - 3:07
    you were on whatever you content you wanted
    to
  • 3:07 - 3:08
    see as the user. You didn't have to wait
  • 3:08 - 3:11
    for your whole browser to refresh. This is
    pretty
  • 3:11 - 3:13
    good. So it's just no full page reloads at
  • 3:13 - 3:15
    all. This is the best experience for the user,
  • 3:15 - 3:17
    and it should sort of feel like a desktop
  • 3:17 - 3:20
    app or a mobile app in terms of the
  • 3:20 - 3:21
    native feel.
  • 3:21 - 3:25
    The best developer experience is a little
    bit different.
  • 3:25 - 3:27
    So, you should be able to use a developer-friendly
  • 3:27 - 3:29
    framework. You should be able to rapidly develop
    something.
  • 3:29 - 3:32
    You shouldn't have to reinvent the wheel.
    Easy things
  • 3:32 - 3:34
    should be easy. So, Ruby on Rails is one
  • 3:34 - 3:36
    of these frameworks. You might have heard
    of this.
  • 3:36 - 3:39
    Kind of why we're here today. So you should
  • 3:39 - 3:41
    be able to use a developer-friendly framework.
  • 3:41 - 3:44
    You should be DRY. You shouldn't have to repeat
  • 3:44 - 3:47
    yourself. D-R-Y. Don't Repeat Yourself. But
    actually, what I
  • 3:47 - 3:49
    mean here is more like DRV. So what is
  • 3:49 - 3:52
    DRV? Well, I mean, you shouldn't have to repeat
  • 3:52 - 3:54
    views. You shouldn't have to write one set
    of
  • 3:54 - 3:56
    views that lives on the client's browser and
    one
  • 3:56 - 3:59
    set of the views that lives on your web
  • 3:59 - 4:00
    server.
  • 4:00 - 4:03
    You should be writing mostly one language.
    At least,
  • 4:03 - 4:04
    in so far as views are concerned. So you
  • 4:04 - 4:07
    shouldn't have to context switch. Context
    switching is very
  • 4:07 - 4:10
    expensive. Sort of switching from Ruby and
    Rails to
  • 4:10 - 4:13
    JavaScript. This is difficult for us, as developers.
  • 4:13 - 4:15
    And your website should be SEO friendly. So
    I
  • 4:15 - 4:18
    guess this part really applies to content
    sites. So
  • 4:18 - 4:21
    I work at RapGenius dot com. Content and SEO
  • 4:21 - 4:24
    friendliness is extremely important for us.
    We lost a
  • 4:24 - 4:26
    bunch of traffic when we actually got banned
    from
  • 4:26 - 4:29
    Google for a little while. They showed us
    exactly
  • 4:29 - 4:32
    how important SEO was. So your site should
    be
  • 4:32 - 4:35
    able to show a crawler, a search engine crawler.
  • 4:35 - 4:38
    HTML that it can index and than make available
  • 4:38 - 4:39
    for users' searching.
  • 4:39 - 4:42
    So so what is the closest thing to this
  • 4:42 - 4:45
    Holy Grail today?
  • 4:45 - 4:50
    Well, it's kind of the node.js. There's a
    node.js
  • 4:50 - 4:51
    solution that I think is the best thing. Come
  • 4:51 - 4:55
    on, boo node.js! Give me some boos.
  • 4:55 - 4:57
    So there's this Airbnb Rendr framework, right.
    So this
  • 4:57 - 5:00
    says render your backbone JS apps on the client
  • 5:00 - 5:03
    and on the server using node.js. So this framework
  • 5:03 - 5:06
    is, you know, pretty easy to use. You write
  • 5:06 - 5:10
    your backbone JS client-side app and the client
    can
  • 5:10 - 5:11
    sort of incrementally update the page and
    this sort
  • 5:11 - 5:15
    of Gmail-like experience. And then the server
    can also
  • 5:15 - 5:19
    render full HTML pages for arbitrarily deep
    links. So
  • 5:19 - 5:21
    the user can still see a full HTML page
  • 5:21 - 5:24
    if they get deep-linked, and a web browser,
    or
  • 5:24 - 5:26
    sorry, a web crawler for a search engine can
  • 5:26 - 5:28
    also see HTML. So this, I think, is the
  • 5:28 - 5:30
    best solution right there. Right, out there
    today.
  • 5:30 - 5:32
    And here, I've actually built like a little
    demo
  • 5:32 - 5:34
    app using render to show you how cool it
  • 5:34 - 5:36
    is. So this is a little bit washed out.
  • 5:36 - 5:38
    But, this is sort of a mini version of
  • 5:38 - 5:41
    our site RapGenius. It's, so RapGenius allows
    you to
  • 5:41 - 5:45
    view documents and read documents and also
    read inline
  • 5:45 - 5:48
    annotations on those documents. And the annotations
    are meant
  • 5:48 - 5:53
    to provide context and also explanation, if
    something's complicated,
  • 5:53 - 5:54
    and just add to the text.
  • 5:54 - 5:57
    So here I've built RailsGenius, which allows
    you to
  • 5:57 - 6:01
    add context to, like, Rails talk abstracts.
    So this
  • 6:01 - 6:04
    is my talk. And I've added some inline annotations
  • 6:04 - 6:05
    here, and the, the point I'm trying to make
  • 6:05 - 6:07
    is that we should be able to, when I
  • 6:07 - 6:09
    click this link, to add views, which is actually
  • 6:09 - 6:12
    an annotation, this shouldn't refresh the
    whole page. It
  • 6:12 - 6:14
    should just load-in the part of the page that
  • 6:14 - 6:16
    changed. Which is a much better experience
    for the
  • 6:16 - 6:16
    user.
  • 6:16 - 6:18
    So if I actually click on this, it just
  • 6:18 - 6:20
    loads that part of the page. You know, this
  • 6:20 - 6:21
    is something that, you know, might be familiar
    to
  • 6:21 - 6:24
    you from using apps, but it's, it's kind of
  • 6:24 - 6:25
    hard to like do this out of the box
  • 6:25 - 6:27
    in Rails. And, you know, also you should be
  • 6:27 - 6:29
    able to like edit it right there and that
  • 6:29 - 6:32
    should just snap in the edit view, et cetera.
  • 6:32 - 6:34
    And this should not be too, too difficult
    to
  • 6:34 - 6:37
    build. Looks like I lost my internet connection.
    There
  • 6:37 - 6:38
    we go.
  • 6:38 - 6:41
    So this kind of stacks up pretty well. It's
  • 6:41 - 6:44
    DRY. We have one set of views. It's SEO-friendly.
  • 6:44 - 6:48
    You know, we can serve HTML the crawlers.
    It's
  • 6:48 - 6:52
    a thick-client feel, so single-page app. Mostly
    write one
  • 6:52 - 6:55
    language. It's backbone JavaScript, et cetera.
    But it is
  • 6:55 - 6:57
    not Rails. So I think it takes, it still
  • 6:57 - 6:59
    took me awhile, even with this render thing,
    to
  • 6:59 - 7:02
    like, create an app that was good. And Rails
  • 7:02 - 7:03
    is just much easier to create like, the vanilla
  • 7:03 - 7:06
    example apps using, like, scaffolding or even
    not using
  • 7:06 - 7:09
    scaffolding. It's just way faster for development.
    So I
  • 7:09 - 7:10
    still think this is bad even though it's the
  • 7:10 - 7:13
    closest thing to the Holy Grail today.
  • 7:13 - 7:16
    But, my point is that Rails, I'm, I'm worried,
  • 7:16 - 7:18
    because I think Rails is kind of getting left
  • 7:18 - 7:19
    in the dust in this respect. Like, it's kind
  • 7:19 - 7:22
    of, there's not really like an established
    solution for
  • 7:22 - 7:26
    building like a thick client good experience
    Rails app.
  • 7:26 - 7:29
    And so now I'm gonna show you some sort
  • 7:29 - 7:32
    of solutions that get part way there. So let's
  • 7:32 - 7:33
    look at those.
  • 7:33 - 7:36
    So one option, and, you know, this is kind
  • 7:36 - 7:37
    of a joke but it's a serious thing that
  • 7:37 - 7:40
    people actually do, is creating one version
    of your
  • 7:40 - 7:42
    app that lives on the client, and one version
  • 7:42 - 7:44
    of your app that lives on the server. And
  • 7:44 - 7:46
    so, you know, in this example you would write
  • 7:46 - 7:48
    erb or HAML on the server, and then you
  • 7:48 - 7:50
    would have an API that returns JSON from the
  • 7:50 - 7:53
    server to the client, and then the client
    would
  • 7:53 - 7:54
    figure out how to render new parts of the
  • 7:54 - 7:56
    page that it wants to snap in using like
  • 7:56 - 8:00
    some kind of frontend like handlebar or underscore.js
    templates.
  • 8:00 - 8:03
    Right, so this seems kind of reasonable. But
    the
  • 8:03 - 8:06
    problem is if you forget to update both templates
  • 8:06 - 8:07
    at the same time, you're gonna end up with
  • 8:07 - 8:10
    some inconsistency between the client and
    the server in
  • 8:10 - 8:12
    terms of the logic. And this can be very,
  • 8:12 - 8:14
    very dangerous. It can lead to some hard to
  • 8:14 - 8:17
    suss out bugs and, you know, we all know
  • 8:17 - 8:19
    DRY is a good thing to strive towards.
  • 8:19 - 8:21
    So this doesn't stack up very well. It's not
  • 8:21 - 8:26
    DRY. It's SEO-friendly. It's a thick client.
    You didn't
  • 8:26 - 8:27
    write mostly one language, though. You had
    to write
  • 8:27 - 8:29
    a bunch of stuff on the client and the
  • 8:29 - 8:31
    server. And we only get a half point for
  • 8:31 - 8:32
    Rails. So you've gotta spend a lot of time
  • 8:32 - 8:35
    still on the frontend noodling around there.
  • 8:35 - 8:39
    All right. So Turbolinks are something you
    also might
  • 8:39 - 8:40
    have heard of. You might be thinking, well
    I
  • 8:40 - 8:41
    can just do this with Turbolinks. This is
    like
  • 8:41 - 8:45
    a one-liner, right? So Turbolinks, the way
    it works,
  • 8:45 - 8:47
    is you write just one set of views, and
  • 8:47 - 8:49
    then when the user clicks on a link, you
  • 8:49 - 8:51
    can just pop in the whole new page but
  • 8:51 - 8:53
    save the browser instance. So you save on
    this
  • 8:53 - 8:57
    overhead of, like, parsing and compiling CSS
    and interpreting
  • 8:57 - 9:00
    JavaScript and, you know, running all this
    stuff. It,
  • 9:00 - 9:01
    it's actually kind of expensive to spin up
    a
  • 9:01 - 9:04
    browser instance for the client. So you, you
    eliminate
  • 9:04 - 9:07
    all that overhead and your client is extremely
    simple.
  • 9:07 - 9:10
    You basically have to write no JavaScript.
  • 9:10 - 9:14
    So the problem is that Turbolinks kind of
    ends
  • 9:14 - 9:16
    there. There's nowhere else to go. If you
    want
  • 9:16 - 9:17
    to snap in, like, just a new part of
  • 9:17 - 9:19
    the page, you've gotta write some kind of
    custom
  • 9:19 - 9:22
    controller action that just returns that part
    of the
  • 9:22 - 9:24
    page and then you've gotta use like some jQuery
  • 9:24 - 9:26
    soup type thing to like snap that in and
  • 9:26 - 9:29
    then you're relying upon your, your page structure.
    So
  • 9:29 - 9:33
    that is not a great solution.
  • 9:33 - 9:35
    But this works pretty well if you're trying
    to
  • 9:35 - 9:38
    do, depending on what you're trying to do.
    So,
  • 9:38 - 9:42
    you know, this is DRY. It is SEO-friendly.
    It's
  • 9:42 - 9:44
    not really like a proper thick client, though.
    It's
  • 9:44 - 9:46
    kind of like a fake thick client. Feels almost
  • 9:46 - 9:48
    like a thick client. Not quite there. Mostly
    write
  • 9:48 - 9:51
    one language. We've got that covered. We've
    also got
  • 9:51 - 9:53
    Rails covered. So this is kind of why Turbolinks
  • 9:53 - 9:55
    is so popular I think. Because it basically
    does
  • 9:55 - 9:58
    what you want without much hassle.
  • 9:58 - 10:02
    So there's also this Ember/Angular/Backbone
    type movement now. You
  • 10:02 - 10:03
    might have sort of seen, there are a bunch
  • 10:03 - 10:05
    of talks about this. People allude to it all
  • 10:05 - 10:07
    the time. This is sort of the new way,
  • 10:07 - 10:10
    this is the new wave of building Rails apps.
  • 10:10 - 10:12
    So you just have a JSON API in your
  • 10:12 - 10:15
    server, that's it. Your entire app experience
    lives on
  • 10:15 - 10:17
    the client, so it lives in JavaScript or CoffeeScript,
  • 10:17 - 10:20
    what have you. And the initial page load,
    the
  • 10:20 - 10:23
    first time your user visits the site, they
    download
  • 10:23 - 10:25
    like this whole JS app thing, and then that
  • 10:25 - 10:26
    sort of boots up and figures out how to
  • 10:26 - 10:27
    like render the site.
  • 10:27 - 10:30
    And so this might remind you of new Twitter.
  • 10:30 - 10:33
    So Twitter in like, 2010 I think released
    this
  • 10:33 - 10:35
    new experience where they were claiming this,
    exactly. They
  • 10:35 - 10:37
    were saying this is going to be much better
  • 10:37 - 10:39
    for our users because we can just sort of
  • 10:39 - 10:42
    like snap in a new Tweet when you click.
  • 10:42 - 10:44
    And they actually found that this was kind
    of
  • 10:44 - 10:46
    costly. Like, sometimes it would take ten
    seconds to
  • 10:46 - 10:49
    render a 140 character Tweet. Because you
    had to
  • 10:49 - 10:52
    download like all these assets and then like
    that
  • 10:52 - 10:53
    would sort of like boot up, spin up and
  • 10:53 - 10:56
    build the page. This isn't like an actually
    good
  • 10:56 - 10:58
    experience for users, at least the first time
    they
  • 10:58 - 11:00
    visit the page. It's actually pretty bad.
  • 11:00 - 11:04
    So it doesn't quite stack up great here. It
  • 11:04 - 11:07
    is DRY. It is not SEO friendly, though. Now,
  • 11:07 - 11:10
    there's some tricks to sort of, making it,
    sort
  • 11:10 - 11:12
    of making it SEO friendly, but, you know,
    for
  • 11:12 - 11:13
    the most part it's kind of hard to make
  • 11:13 - 11:16
    it, you know, allow your app to like serve
  • 11:16 - 11:18
    HTML to a crawler. Now if you're not building
  • 11:18 - 11:20
    a content site, maybe it doesn't matter. But,
    you
  • 11:20 - 11:22
    know, my claim is this is pretty important
    on
  • 11:22 - 11:26
    most websites. It's a thick client. You don't
    get
  • 11:26 - 11:28
    to write mostly one language. Half of it's
    JavaScript.
  • 11:28 - 11:31
    So, again, half point for Rails.
  • 11:31 - 11:33
    So the point that I am trying to make
  • 11:33 - 11:36
    here is that each of these things makes like
  • 11:36 - 11:38
    a key, key trade off that we can't live
  • 11:38 - 11:41
    without. So what are we actually going to
    do
  • 11:41 - 11:42
    about this?
  • 11:42 - 11:44
    Well, now I'm gonna show you like a new
  • 11:44 - 11:46
    solution that, you know, maybe it's good,
    maybe it's
  • 11:46 - 11:51
    not. And actually, this starts with a, sort
    of
  • 11:51 - 11:53
    like, admission. So I kind of lied to you
  • 11:53 - 11:56
    before. I told you I built this app that
  • 11:56 - 11:59
    I was showing you before using render which
    is
  • 11:59 - 12:01
    this like, node.js thing. But the truth is,
    I
  • 12:01 - 12:03
    don't even know JavaScript. I don't even know
    anything
  • 12:03 - 12:05
    about node.js. Render. I just read about it,
    right.
  • 12:05 - 12:09
    I actually built this app using this new sort
  • 12:09 - 12:13
    of like technique slash library called Perspective.
  • 12:13 - 12:15
    So again, here's the same app. And just to
  • 12:15 - 12:18
    remind you, you can kind of click around here
  • 12:18 - 12:21
    and, you know, things just sort of load. And
  • 12:21 - 12:23
    this is a very simple example, but things
    are
  • 12:23 - 12:25
    snapping in, you know, just the parts of the
  • 12:25 - 12:28
    page that are changing. Need to get changed.
    And
  • 12:28 - 12:30
    you can sort like edit and save stuff. And
  • 12:30 - 12:32
    we're just sort of updating parts of the page
  • 12:32 - 12:34
    that need to change.
  • 12:34 - 12:37
    And so this is this perspectives thing, which
    I'm
  • 12:37 - 12:39
    claiming is better, right. So let's see how
    it
  • 12:39 - 12:43
    stacks up on the chart that I just made.
  • 12:43 - 12:47
    It's DRY. It's SEO-friendly. It's a thick
    client. You
  • 12:47 - 12:48
    write mostly one lang- I think you see where
  • 12:48 - 12:51
    this is going. And it's Rails. So I checked
  • 12:51 - 12:53
    all the boxes in my own talk. This is
  • 12:53 - 12:55
    a key, key thing. You have to be able
  • 12:55 - 12:57
    to do this if you're gonna speak at RailsConf.
  • 12:57 - 13:00
    You gotta have a chart, checks all the boxes.
  • 13:00 - 13:02
    This is good.
  • 13:02 - 13:06
    So, you know, the key sort of thing here,
  • 13:06 - 13:09
    the key part of Perspectives, is that we want
  • 13:09 - 13:12
    to be able to share our templates between
    the
  • 13:12 - 13:14
    client and the server. So like the server
    should
  • 13:14 - 13:16
    be able to render full HTML. And the client
  • 13:16 - 13:18
    should be able to like receive JSON and like
  • 13:18 - 13:19
    render a template, right. This is sort of
    the
  • 13:19 - 13:21
    appeal of something like render.
  • 13:21 - 13:28
    So, here, you know, let's, let's say we thought,
  • 13:28 - 13:31
    well maybe we can sort of share templates.
    Maybe
  • 13:31 - 13:33
    we can share our existing erb templates. Those
    are
  • 13:33 - 13:35
    pretty easy to write. So here's like a simple
  • 13:35 - 13:37
    erb template, right. We're just generating
    like a link
  • 13:37 - 13:39
    to a user. We're using the name as like
  • 13:39 - 13:42
    the anchor text. We're using user_url helper
    from Rails
  • 13:42 - 13:44
    to like generate a link to it. This is
  • 13:44 - 13:47
    pretty simple. You might imagine that using
    something like
  • 13:47 - 13:51
    Opal, which transforms Ruby in JavaScript,
    you could like
  • 13:51 - 13:53
    pour it your whole server, kind of like, instance,
  • 13:53 - 13:57
    including all these helpers link link_to and
    user_url, to
  • 13:57 - 13:59
    JavaScript, and then you could just jump down
    your
  • 13:59 - 14:01
    erb template and then that could get sort
    of
  • 14:01 - 14:03
    rendered on the client.
  • 14:03 - 14:04
    This might, you know, you might think that
    this
  • 14:04 - 14:07
    works. But, actually, you can kind of do more
  • 14:07 - 14:09
    stuff in erb than you might sort of be
  • 14:09 - 14:12
    aware of from simple examples. Like, you can,
    here's
  • 14:12 - 14:14
    an example, where I'm actually just running
    like a
  • 14:14 - 14:17
    SQL query in an erb template. And this, I
  • 14:17 - 14:22
    think, demonstrates like, the fundamental
    difference - yeah, boo!
  • 14:22 - 14:25
    This, I think, demonstrates like a fundamental
    difference between,
  • 14:25 - 14:28
    you know, the client and the server, is that,
  • 14:28 - 14:30
    they're kind of in different environments.
    Like, the server
  • 14:30 - 14:33
    has access to resources that the client, not
    only
  • 14:33 - 14:35
    doesn't have access to but shouldn't have
    access to.
  • 14:35 - 14:38
    The client should not ever be able to like
  • 14:38 - 14:40
    hook up to the database and ask some questions.
  • 14:40 - 14:42
    Right, so. And the client is the same. Like,
  • 14:42 - 14:44
    the client knows stuff about the user's browser.
    Like,
  • 14:44 - 14:47
    they can inspect local storage and all this
    stuff.
  • 14:47 - 14:50
    Like, they're fundamentally different environments.
    And so I don't
  • 14:50 - 14:52
    think that any of the existing templates out
    there
  • 14:52 - 14:55
    really get you this sort of shared environment
    for
  • 14:55 - 14:56
    free.
  • 14:56 - 15:00
    So, the way, you know, so the way to
  • 15:00 - 15:03
    get to a shared template between a client
    and
  • 15:03 - 15:05
    a server is to find the lowest common denominator.
  • 15:05 - 15:08
    So, like, if you've taken, you know, calculus
    at
  • 15:08 - 15:10
    the graduate level, you might have heard of
    the
  • 15:10 - 15:14
    lowest common denominator. It's the way that
    you are
  • 15:14 - 15:16
    able to like, if you're trying to add fractions,
  • 15:16 - 15:19
    you can like, multiply the denominator-
  • 15:19 - 15:21
    The point is, it allows you to like find
  • 15:21 - 15:25
    some common ground between, you know, the
    client and
  • 15:25 - 15:28
    the server, right. So we need lowest common
    denominator.
  • 15:28 - 15:30
    Which is the dumbest possible template. So
    we need
  • 15:30 - 15:33
    something that's really dumb, that has, that
    basically can't
  • 15:33 - 15:36
    do anything. And so what is that? Well, that's
  • 15:36 - 15:39
    mustache. Mustache are the dumbest templates
    out there. Don't
  • 15:39 - 15:41
    tell them I said that. They're probably in
    the
  • 15:41 - 15:43
    other room or something. But they're, they're
    pretty dumb.
  • 15:43 - 15:47
    You know, you might have heard mustache templates
    referred
  • 15:47 - 15:50
    to as being logic-less. I actually think logic-less
    is
  • 15:50 - 15:52
    kind of like a bad way of describing it.
  • 15:52 - 15:54
    Because when I hear logic-less, I'm kind of
    thinking,
  • 15:54 - 15:56
    like, OK, I can't write like an if statement.
  • 15:56 - 15:59
    There's probably no like for loop situation.
    Like, what
  • 15:59 - 16:00
    else can't I do? Well I probably can't do
  • 16:00 - 16:02
    like an if-else, like, you know, the reality
    is
  • 16:02 - 16:04
    you can actually kind of do that stuff. It's
  • 16:04 - 16:06
    called a different thing. So I don't like
    using
  • 16:06 - 16:08
    the word logic-less.
  • 16:08 - 16:10
    It's more like you can't run arbitrary code.
    It's
  • 16:10 - 16:13
    more like no code, code-less or something.
    So you
  • 16:13 - 16:15
    can't run arbitrary code. This is the sort
    of
  • 16:15 - 16:18
    take away from mustache, right. And so, you
    know,
  • 16:18 - 16:20
    this is kind of cool because, because you
    can't
  • 16:20 - 16:24
    run arbitrary code, we can write mustache
    template renders
  • 16:24 - 16:26
    in all these different languages. So you can
    easily
  • 16:26 - 16:30
    render mustache templates in Ruby or JavaScript.
    If you
  • 16:30 - 16:31
    want to use one of these other languages,
    these
  • 16:31 - 16:33
    are terrible, but I guess you could use like
  • 16:33 - 16:35
    dot net or something if you wanted to render
  • 16:35 - 16:38
    a mustache template in dot net. I don't know
  • 16:38 - 16:39
    what you're doing but you might be able to
  • 16:39 - 16:40
    do that.
  • 16:40 - 16:42
    So, to show you like how to create a
  • 16:42 - 16:44
    mustache template, I want to look at like
    a
  • 16:44 - 16:47
    specific example. So here's, like, the RailsGenius
    app, and,
  • 16:47 - 16:49
    you know, in the left, lower left-hand corner
    here
  • 16:49 - 16:52
    there's like an annotation, right. So this
    is sort
  • 16:52 - 16:56
    of annotating the line node.js. And if we
    sort
  • 16:56 - 16:57
    of zoom in on this thing, we can see
  • 16:57 - 17:00
    there are a few different components.
  • 17:00 - 17:03
    There's the section of text that's annotated.
    So we'll
  • 17:03 - 17:05
    call that the referent. This is like a fancy
  • 17:05 - 17:07
    word for like reference or something. So we'll
    call
  • 17:07 - 17:10
    that the referent. That's the line that I
    highlighted
  • 17:10 - 17:12
    and explained. And then we'll call this the
    sort
  • 17:12 - 17:15
    of body. And you'll notice the body can contain
  • 17:15 - 17:18
    like arbitrary HTML. There's a link to node.js
    dot
  • 17:18 - 17:20
    org. A link to Ruby on Rails, et cetera.
  • 17:20 - 17:22
    I'm sort of adding, like, you know, I'm adding
  • 17:22 - 17:25
    hyper media here because it's the web.
  • 17:25 - 17:27
    And then there's this edit link, right. And
    so
  • 17:27 - 17:29
    this edit link, you might imagine, should
    appear for
  • 17:29 - 17:32
    some users and not others depending on, like,
    what
  • 17:32 - 17:35
    your permissions are or what your sort of
    situation
  • 17:35 - 17:37
    is.
  • 17:37 - 17:40
    And so mustache, the, the template for this,
    the
  • 17:40 - 17:42
    whole template, looks like this. So I'm gonna
    go
  • 17:42 - 17:44
    into like the specifics of how I would actually,
  • 17:44 - 17:46
    you know, what this is doing. But here's the
  • 17:46 - 17:49
    template. And to render this, I just need
    this
  • 17:49 - 17:52
    hash of JSON data. So I can render this
  • 17:52 - 17:54
    anywhere as long as I have this hash. Key
  • 17:54 - 17:56
    thing to remember.
  • 17:56 - 18:01
    So, if I can't run code in mustache, like
  • 18:01 - 18:04
    I can run code in erb, how do I
  • 18:04 - 18:06
    actually like put data in the markup, which
    is
  • 18:06 - 18:09
    like the whole point of templates, right?
  • 18:09 - 18:11
    So you can use these tags. Right, so given
  • 18:11 - 18:15
    this section of JSON, you have a referent
    mapping
  • 18:15 - 18:18
    to node dot js, right. We can render that
  • 18:18 - 18:21
    data into this template with a, you know,
    inside
  • 18:21 - 18:23
    of a block quote, by using this double curly
  • 18:23 - 18:26
    brace thing. This just says, like, basically,
    gsub, or
  • 18:26 - 18:29
    actually not gsub, sub this referant into,
    inside this
  • 18:29 - 18:31
    block quote. Pretty simple.
  • 18:31 - 18:32
    So this is just gonna print like block quote
  • 18:32 - 18:37
    node.js, you know. That should hopefully be
    fairly self-evident.
  • 18:37 - 18:39
    So if you want to sort of do something
  • 18:39 - 18:42
    where you're printing raw HTML, the double
    brace will
  • 18:42 - 18:44
    actually escape it. So that's most the time
    what
  • 18:44 - 18:46
    you want. But in this case we're actually
    like,
  • 18:46 - 18:50
    you know, we want hyper media in that annotation.
  • 18:50 - 18:52
    So this, you know, actually has an href. An
  • 18:52 - 18:53
    a tag, rather.
  • 18:53 - 18:55
    So we're gonna use the triple brace, which
    is
  • 18:55 - 18:57
    another type of tag that says print this HTML
  • 18:57 - 19:00
    raw. So this will actually print out, like,
    you
  • 19:00 - 19:03
    know, real anchor tag. Which is, in this case,
  • 19:03 - 19:06
    what we want. So here is the sort of
  • 19:06 - 19:08
    meat of mustache. This is probably the trickiest
    part
  • 19:08 - 19:10
    of mustache. There's another type of tag which
    is
  • 19:10 - 19:14
    this sort of double brace hash block, right.
  • 19:14 - 19:17
    So here is the block that I'm talking about.
  • 19:17 - 19:18
    So you can see this double brace, and then
  • 19:18 - 19:21
    there's hash edit. This hash is kind of where
  • 19:21 - 19:23
    the logic by another name comes into play
    in
  • 19:23 - 19:26
    mustache. So this is going to, if edit is
  • 19:26 - 19:28
    like, a boolean type thing, it's going to
    run,
  • 19:28 - 19:30
    or, or go into the block. If edit is
  • 19:30 - 19:34
    true, if edit is like a list of something,
  • 19:34 - 19:35
    it basically is your for loop is the way
  • 19:35 - 19:37
    to think about it.
  • 19:37 - 19:38
    There's one more thing that is like if edit
  • 19:38 - 19:40
    is like a hash, it kind of just will
  • 19:40 - 19:44
    run the intersection if the hash is there.
    Otherwise
  • 19:44 - 19:47
    it won't. So in this case, we're just saying,
  • 19:47 - 19:48
    you know, we should show the edit link. That's
  • 19:48 - 19:50
    what edit true means. This is our logic by
  • 19:50 - 19:54
    another name. And then we're actually, you
    know, grabbing
  • 19:54 - 19:57
    the edit href from the JSON hash as well.
  • 19:57 - 19:59
    And so this will result in just putting the,
  • 19:59 - 20:00
    printing the edit link.
  • 20:00 - 20:03
    Now if edit were false, it wouldn't print
    that.
  • 20:03 - 20:05
    And so you might be asking, like, well what
  • 20:05 - 20:06
    if I wanted to do something else. Like I'm
  • 20:06 - 20:10
    used to writing these if-else statements.
    So mustache also
  • 20:10 - 20:13
    has this other sort of tag, which is a
  • 20:13 - 20:17
    carrot. SO there's like double, double squiggly,
    double curly
  • 20:17 - 20:19
    brace, carot edit, which just means sort of
    go
  • 20:19 - 20:23
    into this block if edit is unset or false.
  • 20:23 - 20:25
    So this is the kind of last tag. So
  • 20:25 - 20:27
    in this case, if edit were false, we would
  • 20:27 - 20:30
    just print can't edit. So this is mustache.
    That's
  • 20:30 - 20:32
    basically all you can do.
  • 20:32 - 20:35
    So how does this actually help us? Well, I
  • 20:35 - 20:37
    don't know if you guys remember, but at the
  • 20:37 - 20:40
    beginning of this mustache section, I showed
    you this
  • 20:40 - 20:43
    template and I said all you need to render
  • 20:43 - 20:45
    this template is this hash. And I also told
  • 20:45 - 20:47
    you that there's a Ruby library for this and
  • 20:47 - 20:49
    a JavaScript library for this.
  • 20:49 - 20:50
    So I think you might see where this is
  • 20:50 - 20:52
    going. If we have some way of generating like
  • 20:52 - 20:55
    a hash, anywhere, then we can render it, we
  • 20:55 - 20:57
    can ship the template and the hash to any
  • 20:57 - 21:00
    environment and like render it there.
  • 21:00 - 21:01
    That's the point I'm trying to make. So how
  • 21:01 - 21:04
    do we actually generate this hash? That's
    the sort
  • 21:04 - 21:06
    of tricky part. Well I'm gonna do some handwaving
  • 21:06 - 21:08
    here and say, well, this, Perspective's library
    might help
  • 21:08 - 21:10
    us a little bit.
  • 21:10 - 21:13
    So you know here's a traditional Rails view.
    This
  • 21:13 - 21:16
    is like an erb template, right. And so what
  • 21:16 - 21:18
    I'm saying is that if we split this into
  • 21:18 - 21:22
    a template, which is mustache, and a perspective,
    which
  • 21:22 - 21:25
    is something, it's a new type of object, then
  • 21:25 - 21:27
    we can just have this data transport thing,
    which
  • 21:27 - 21:29
    is just the hash, which is generated by the
  • 21:29 - 21:32
    perspective. And then we can render the template
    anywhere.
  • 21:32 - 21:34
    So this is how we render on the client
  • 21:34 - 21:36
    or the server.
  • 21:36 - 21:38
    So what is this perspective thing look like?
    Well,
  • 21:38 - 21:40
    as you might imagine, it's a bunch of stuff
  • 21:40 - 21:44
    that specifies what is in the hash. So, here's
  • 21:44 - 21:47
    the whole perspective. I'm gonna dive into
    different parts
  • 21:47 - 21:49
    of it. But you can see it's just basically
  • 21:49 - 21:51
    a Ruby object with like some macros thrown
    in.
  • 21:51 - 21:52
    That's, that's sort of the goal of the library.
  • 21:52 - 21:56
    It should just be a Ruby object. Plain Ruby
  • 21:56 - 21:57
    object.
  • 21:57 - 22:00
    So you can specify inputs, which you specify
    with
  • 22:00 - 22:03
    params. So you can say param annotation, this
    perspective
  • 22:03 - 22:08
    expects an annotation as input. You can specify
    outputs.
  • 22:08 - 22:12
    This perspective outputs reference, which
    is the annotation's referent
  • 22:12 - 22:16
    property. It also specifies body as a key.
    And
  • 22:16 - 22:19
    that's the annotation's body as HTML. So this
    is
  • 22:19 - 22:20
    gonna be raw HTML.
  • 22:20 - 22:24
    And so properties our output. And so these
    are
  • 22:24 - 22:27
    actually just keys in this hash. So we can
  • 22:27 - 22:31
    just turn this perspective object into a JSON
    object
  • 22:31 - 22:33
    and then that can be rendered anywhere. So
    now
  • 22:33 - 22:36
    that we know what this perspective object
    is, it
  • 22:36 - 22:38
    should be pretty self-explanatory how we get
    from the
  • 22:38 - 22:41
    right over to the left and render this template.
  • 22:41 - 22:43
    Now you might be thinking, isn't this just
    like
  • 22:43 - 22:46
    a fancy version of like helpers or something?
    Like,
  • 22:46 - 22:49
    helpers with like a namespace? And it's actually
    different
  • 22:49 - 22:52
    because, you know, helpers are sort of operating
    at,
  • 22:52 - 22:54
    they seem like they kind of live in their
  • 22:54 - 22:57
    own separate object, like annotations' helper
    or something. But
  • 22:57 - 23:00
    actually they're in a global namespace which
    can be
  • 23:00 - 23:02
    called from any template at any time. And
    so
  • 23:02 - 23:04
    they can kind of like override each other.
  • 23:04 - 23:07
    They also are direct function indication.
    So this is
  • 23:07 - 23:09
    just data. This hash in the middle is just
  • 23:09 - 23:12
    data. SO like if you reference a property
    twice,
  • 23:12 - 23:14
    you're always gonna get the same value, unlike
    a
  • 23:14 - 23:17
    helper, which could theoretically return different
    things if you
  • 23:17 - 23:19
    call it different times. SO it's kind of like
  • 23:19 - 23:22
    a safer thing for us as developers.
  • 23:22 - 23:25
    And so to build like an app with this,
  • 23:25 - 23:28
    you can imagine the initial request that the
    client
  • 23:28 - 23:31
    makes will receive HTML so the, the server
    will
  • 23:31 - 23:34
    say, OK let me take this perspective thing,
    turn
  • 23:34 - 23:36
    it into JSON, render in mustache template
    and then
  • 23:36 - 23:38
    send that back to the user. And, in the
  • 23:38 - 23:40
    case of like new Twitter, the user would just
  • 23:40 - 23:42
    see the 140 character Tweet rendered. And
    in the
  • 23:42 - 23:45
    case of like a web-crawler for a search engine,
  • 23:45 - 23:47
    it would see like the full HTML that it
  • 23:47 - 23:48
    can then index.
  • 23:48 - 23:50
    And then subsequent requests, just like we
    would do
  • 23:50 - 23:52
    with like Ember or Backbone or whatever, we
    just
  • 23:52 - 23:55
    request JSON from the server and then we render
  • 23:55 - 23:59
    the part of the page that needs to change.
  • 23:59 - 24:02
    So, you the know, the key thing here I
  • 24:02 - 24:06
    think is that HTML is unstructured data. And
    so
  • 24:06 - 24:08
    a lot of like sort of Rails patterns will
  • 24:08 - 24:11
    tell you just return like the snippet of HTML
  • 24:11 - 24:13
    from the server that you need and then snap
  • 24:13 - 24:16
    that in somewhere. And the eventually leads
    to like
  • 24:16 - 24:20
    soupy code and coupling to like classes on
    HTML
  • 24:20 - 24:22
    elements, which leads to a lot of like weirdo
  • 24:22 - 24:24
    bugs that are hard to track down.
  • 24:24 - 24:27
    JSON, on the other hand, is structured data.
    It's
  • 24:27 - 24:29
    a lot easier to deal with this, so, you
  • 24:29 - 24:31
    can either render it or you could do something,
  • 24:31 - 24:34
    you know, on the client that's a little fancier.
  • 24:34 - 24:35
    If you want to do, update different parts
    of
  • 24:35 - 24:38
    the page, whatever. The point is that it's
    structured
  • 24:38 - 24:39
    and it's easy to deal with. And if you're
  • 24:39 - 24:43
    building out like a thick client, you want
    to
  • 24:43 - 24:48
    couple your client experience to structured
    data, not unstructured
  • 24:48 - 24:49
    data.
  • 24:49 - 24:52
    All right, so I'm gonna do the quick getting
  • 24:52 - 24:53
    started. You know this is, this is sort of
  • 24:53 - 24:55
    about this library, but I don't want it to
  • 24:55 - 24:56
    be all about this library. So, you know, it's
  • 24:56 - 24:59
    just a gem. You can just generate the install
  • 24:59 - 25:02
    for it. That'll like make your app perspectivified.
    You
  • 25:02 - 25:05
    can scaffold stuff. You know, you break your
    erb
  • 25:05 - 25:10
    templates into mustache templates and a perspective.
    And you
  • 25:10 - 25:13
    just add this one line to your controller,
    so
  • 25:13 - 25:15
    this just uses a responder to figure out if
  • 25:15 - 25:18
    the client wants HTML or wants JSON, and turns
  • 25:18 - 25:20
    the perspective into whatever you want to.
    In this
  • 25:20 - 25:23
    case, it's just, you know, find this annotation
    by
  • 25:23 - 25:26
    ID. Use this little macro to create your perspective
  • 25:26 - 25:28
    and pass it the data it needs, which in
  • 25:28 - 25:30
    this case is like an annotation. And then
    we
  • 25:30 - 25:34
    can render a JSON version or an HTML version.
  • 25:34 - 25:38
    So what else does this buy us? So clearly
  • 25:38 - 25:40
    this rendering on the client and server thing
    is
  • 25:40 - 25:43
    pretty good. But actually, I didn't like set
    out,
  • 25:43 - 25:45
    when I was thinking about this, to like build
  • 25:45 - 25:47
    some sort of like new thick client like framework
  • 25:47 - 25:50
    thing that competes with Ember. That wasn't
    my goal
  • 25:50 - 25:53
    and I'm still not sure that's my goal. The
  • 25:53 - 25:55
    benefits I'm about to tell you about were
    actually
  • 25:55 - 25:57
    like the initial inspiration for like wanting
    to build
  • 25:57 - 25:58
    this library.
  • 25:58 - 26:03
    So, number one is separation of concerns.
    So, I
  • 26:03 - 26:07
    really hate seeing erb templates like this.
    Here's like
  • 26:07 - 26:09
    an erb version of the template I just showed
  • 26:09 - 26:11
    you. So instead of having like a nice edit
  • 26:11 - 26:14
    property, there's often like some logic in
    here, if
  • 26:14 - 26:17
    you look at the bottom there, that's checking,
    like,
  • 26:17 - 26:19
    whether or not to show the edit link. And
  • 26:19 - 26:21
    this is kind of ugly. It's kind of ugly
  • 26:21 - 26:23
    no matter where it lives. But it's especially
    ugly
  • 26:23 - 26:25
    if it lives in a template.
  • 26:25 - 26:26
    And it is so easy to do this with
  • 26:26 - 26:29
    erb, cause, you know, erb literally just means
    embedded
  • 26:29 - 26:32
    Ruby. So you can just write anything. Like
    I,
  • 26:32 - 26:34
    like I've seen saying. SO like here we're
    saying,
  • 26:34 - 26:37
    the person can edit the annotation if they
    created
  • 26:37 - 26:39
    or they're like a super admin type, type,
    type
  • 26:39 - 26:42
    user.
  • 26:42 - 26:47
    So, mustache and perspectives force you into
    this separation
  • 26:47 - 26:50
    of concerns, where you literally can't write
    any code
  • 26:50 - 26:52
    in your template. So you have to put it
  • 26:52 - 26:54
    in the perspective, which is just a Ruby object,
  • 26:54 - 26:56
    which is where it kind of belongs. And there's
  • 26:56 - 27:00
    no, there's no love for this in erb land
  • 27:00 - 27:01
    in Rails. You're kind of, you're kind of off
  • 27:01 - 27:03
    in this waste land of like, I guess I'll
  • 27:03 - 27:05
    throw some view logic in here. I don't really
  • 27:05 - 27:08
    know where it's supposed to go.
  • 27:08 - 27:09
    And so this, this leads me to like, so
  • 27:09 - 27:11
    here's the, sorry, here's the perspective
    version of it,
  • 27:11 - 27:14
    where actually just generate this edit property
    and say
  • 27:14 - 27:16
    whether or not we want to display the link,
  • 27:16 - 27:19
    based on that logic I showed you before.
  • 27:19 - 27:21
    So this also gives you like, testing. So I
  • 27:21 - 27:23
    now DHH was like, you know, shitting on this
  • 27:23 - 27:26
    in his talk. I still think testing is important.
  • 27:26 - 27:28
    Maybe not TDD. But like the point is, if
  • 27:28 - 27:31
    you wanted to test like an erb template and
  • 27:31 - 27:33
    had some logic in this, in it, you would
  • 27:33 - 27:35
    have to like, render, the only thing you can
  • 27:35 - 27:37
    do is render the template. You can't talk
    to
  • 27:37 - 27:38
    it. It's not an object. You can't ask it
  • 27:38 - 27:40
    questions. All you can do is render it and
  • 27:40 - 27:42
    then do like a string-match on it.
  • 27:42 - 27:43
    And in fact, I've seen a ton of tests
  • 27:43 - 27:46
    like this. Web driver tests are basically
    just doing
  • 27:46 - 27:48
    like, advanced regexes to like figure out
    if the
  • 27:48 - 27:51
    logic is right. And this is really bad. A
  • 27:51 - 27:54
    perspective is just a freakin' object. Like
    you just
  • 27:54 - 27:56
    new it up and pass it the data it
  • 27:56 - 27:58
    needs and then you can test your logic. SO
  • 27:58 - 28:00
    here I'm just creating a test double. You
    know,
  • 28:00 - 28:02
    test doubles are important in testing. Test
    double for
  • 28:02 - 28:05
    a user, test double for an annotation. I'm
    creating
  • 28:05 - 28:08
    this new perspective and then I'm asking it
    if
  • 28:08 - 28:10
    the edit link is true and verifying that it
  • 28:10 - 28:14
    should be showing that.
  • 28:14 - 28:17
    So another thing is caching. So this is like
  • 28:17 - 28:19
    maybe a little bit difficult to motivate,
    but like,
  • 28:19 - 28:22
    this sort of like cache digest thing, Russian
    doll
  • 28:22 - 28:24
    caching thing is kind of hard for me to
  • 28:24 - 28:26
    like wrap my brain around, right. Like, you
    have
  • 28:26 - 28:28
    to, you have to write, sometimes, like a special
  • 28:28 - 28:30
    comment to get the templates to know about
    each
  • 28:30 - 28:34
    other. Not as good as just having objects
    that
  • 28:34 - 28:35
    know about each other.
  • 28:35 - 28:38
    So if you want to cache an annotation show
  • 28:38 - 28:40
    perspective, you just use this cache macro
    and that
  • 28:40 - 28:44
    says, use the annotation as the cache key,
    right.
  • 28:44 - 28:46
    And so if you're familiar with, like, cache
    keys
  • 28:46 - 28:49
    in Rails, if you're using generational caching,
    this will
  • 28:49 - 28:50
    just say, the cache key - hopefully you can
  • 28:50 - 28:53
    see this - is just the type of object,
  • 28:53 - 28:54
    the id of the object, and when it was
  • 28:54 - 28:55
    last updated.
  • 28:55 - 28:57
    So this will like fall out of cache if
  • 28:57 - 28:59
    anyone updates the annotation or if it's like
    a
  • 28:59 - 29:01
    different annotation it'll have a different
    cache key. So
  • 29:01 - 29:05
    this sort of, hopefully this is, is somewhat
    familiar.
  • 29:05 - 29:07
    If you have another template that you're rendering,
    like
  • 29:07 - 29:11
    here, this annotation show perspective, is
    rendering a nested
  • 29:11 - 29:14
    user slash avatar perspective, so you can
    see that
  • 29:14 - 29:16
    at the bottom. You might want to say, well,
  • 29:16 - 29:19
    if the user updates their avatar, we also
    want
  • 29:19 - 29:20
    this to fall out of cache.
  • 29:20 - 29:22
    This is sort of the, the Russian doll caching
  • 29:22 - 29:25
    of it all, right. So if the inside Russian
  • 29:25 - 29:27
    doll is uncached then it should bust the outside
  • 29:27 - 29:30
    Russian dolls cache key. So this thing, you
    can
  • 29:30 - 29:33
    also assign a cache key to. You can say,
  • 29:33 - 29:34
    cache based on the user. So if the user
  • 29:34 - 29:37
    gets updated from the user's avatar perspective,
    we want
  • 29:37 - 29:40
    this to fall out of cache. And so, like
  • 29:40 - 29:42
    I said, we want the whole thing to fall
  • 29:42 - 29:44
    out of cache if the user gets updated or
  • 29:44 - 29:46
    the annotation gets updated.
  • 29:46 - 29:48
    And so what perspective will do for you is
  • 29:48 - 29:50
    say, OK, we know that there's a nested user's
  • 29:50 - 29:53
    avatar perspective here, and so to generate
    the cache
  • 29:53 - 29:55
    key for this whole thing, we're just going
    to
  • 29:55 - 29:58
    concatenate the cache key from the annotation
    and the
  • 29:58 - 30:00
    cache key from the user and produce this ugly,
  • 30:00 - 30:02
    terrible, long cache key, which you don't
    have to
  • 30:02 - 30:05
    worry about at any point as the writer of
  • 30:05 - 30:06
    the code.
  • 30:06 - 30:08
    So this is all sort of handled transparently
    for
  • 30:08 - 30:12
    you. So are we ready to sail off, to
  • 30:12 - 30:15
    drive off into the sunset in Rails land now
  • 30:15 - 30:19
    with this new stuff? Well, not quite. The,
    the
  • 30:19 - 30:21
    point I'm trying to make here is that, or
  • 30:21 - 30:23
    one thing I want to get across here is
  • 30:23 - 30:24
    that this is sort of a nascent library slash
  • 30:24 - 30:28
    weekend project motivated by, you know, having,
    making it
  • 30:28 - 30:32
    annoying to like, do caching, and it's hard
    to
  • 30:32 - 30:35
    kind of separate your, your templates out,
    and also
  • 30:35 - 30:37
    I'd like to be able to like render the
  • 30:37 - 30:40
    same thing on the client and server. But there's
  • 30:40 - 30:41
    still a bunch of stuff to be done, right.
  • 30:41 - 30:43
    Like there's still some work to be done to
  • 30:43 - 30:46
    like integrate this with existing like frontend
    frameworks if
  • 30:46 - 30:48
    you want to add like a bunch more rich
  • 30:48 - 30:51
    experiences on the client.
  • 30:51 - 30:54
    And I want to get to the point, though,
  • 30:54 - 30:56
    where we can have a good answer to these
  • 30:56 - 30:57
    node.js libraries. Like this is a big motivation.
    Like
  • 30:57 - 31:00
    I'm tired of node.js being, like, well let's
    just
  • 31:00 - 31:05
    embrace JavaScript. Like, no let's not embrace
    JavaScript. Ruby.
  • 31:05 - 31:08
    Ruby is better. So let's, let's get at them.
  • 31:08 - 31:10
    But, the key take away is you shouldn't be
  • 31:10 - 31:12
    sort of creating one version of your app that
  • 31:12 - 31:14
    lives on the server and one that lives on
  • 31:14 - 31:17
    the client. The ideal situation is move most
    of
  • 31:17 - 31:19
    the stuff to the server but be able to
  • 31:19 - 31:23
    like still create this thick client situation.
  • 31:23 - 31:25
    So that's it. That's my talk. You can check
  • 31:25 - 31:29
    out this library by going to RapGenius slash
    perspectives
  • 31:29 - 31:31
    on GitHub, or if you're lazy, there's this
    bit.ly
  • 31:31 - 31:34
    link. bit.ly slash RG perspectives. And also,
    as I
  • 31:34 - 31:37
    said at the beginning of the talk, we are
  • 31:37 - 31:39
    hiring. So if you're sort of interested in
    this
  • 31:39 - 31:42
    kind of stuff or other stuff Rap Genius related,
  • 31:42 - 31:43
    get at me. Hit me up on Twitter. Hit
  • 31:43 - 31:46
    me up via email. Andy at RapGenius dot com.
  • 31:46 - 31:48
    And I think we have time for some questions.
Title:
RailsConf 2014 - Where did the OO go? Views Should be Objects Too!
Description:

more » « less
Duration:
32:19

English subtitles

Revisions