
Show HN: kutty, jQuery-free intercooler.js - recursivedoubts
https://kutty.org/posts/2020-5-15-kutty-0.0.1-is-released/
======
ComputerGuru
Big intercooler fan here, I’ll definitely be checking this out.

For others interested in this field of “graceful enhancement” see also unpoly:
[https://unpoly.com/](https://unpoly.com/)

OP may also want to look into integrating some features/ideas from there as it
is very similar to intercooler.

~~~
scwoodal
Another vote for unpoly, it’s jquery free as well.

I’m currently using it in a project that’s a PWA and its been a pleasure to
work with.

~~~
piranha
Well, it’s the same size as intercooler plus jQuery, so not a lot of savings
here. :)

~~~
scwoodal
Size aside, there was a considerable increase in performance after jquery was
removed.

[https://blog.makandra.com/2019/01/performance-impact-of-
remo...](https://blog.makandra.com/2019/01/performance-impact-of-removing-
jquery/)

------
recursivedoubts
this is my covid project: a ground up, jQuery (and all other
dependencies)-free rewrite of intercooler.js

~~~
CSSer
I've been really interested in Intercooler.js, but the jQuery dependency
bummed me out. This is a very cool project, and I highly appreciate you
putting in the work here!

I do have one question. Is there a specific reason why you chose not to follow
the standardized specification[0] of using data-* prefixes for HTML
attributes? I realize it's pedantic, but I'd like to see this project receive
wide support and usage. I'm concerned many potential users will criticize
this.

[0]: [https://html.spec.whatwg.org/multipage/dom.html#embedding-
cu...](https://html.spec.whatwg.org/multipage/dom.html#embedding-custom-non-
visible-data-with-the-data-%2a-attributes)

Edit: Nevermind, I just looked through the docs from the start. You do support
it!

~~~
recursivedoubts
:) Yep, do it the way you like.

Btw, check out the kt-classes attribute if you want to do some slick CSS
transitions w/o javascript:

[https://kutty.org/attributes/kt-classes/](https://kutty.org/attributes/kt-
classes/)

------
dec0dedab0de
I got in so many arguments at work defending intercooler.js, eventually I
caved and started using angular. I'm still regretting it.

~~~
ng12
One of you is definitely wrong, but it depends on the scope of the project. I
would never build an SPA with intercooler and I would never build a static
website with Angular/React.

~~~
freelancercv
> I would never build a SPA with intercooler

and why is that? Though mithril.js fan here, but intercooler, kitty, unpoly -
they look fantastic kit for SPA. These libraries just look like what Golang is
against C++ and Java.

~~~
ng12
For the same reason I use React instead of jQuery. Kutty/Intercooler handle
simple AJAX very cleanly but as the volume of data and scope of interactivity
increases it becomes difficult to manage.

------
janwillemb
YSK that in Dutch the name kutty resembles the popular term for the female
reproductive organs.

~~~
kalev
I genuinly LOL'ed seeing this name. I would definitely consider changing it.

~~~
recursivedoubts
nah, it's all good:

[https://www.urbandictionary.com/define.php?term=kutty](https://www.urbandictionary.com/define.php?term=kutty)

Maybe in dutch it can be called mutty.

------
aitchnyu
I was amazed that this page preserved HTML and scroll even for dynamic
content. I'm thinking about how to do the same in Vue, and my crazy idea is
using a store/controller for each path and storing and retrieving it from an
LRU cache on history events.

[https://kutty.org/examples/click-to-load/](https://kutty.org/examples/click-
to-load/)

------
mosselman
This reminds me a lot of rails-ujs. I built a jquery-based alternative to
intercooler (didn't know it existed) back in the day that used the rails-ujs
events to do its thing.

A few days ago, instead of going this route, I just used a `.js` view in Rails
to replace the necessary elements in the DOM. This is even easier than having
to load something like kutty and specifying in attributes what it needs to do:

Taken from the Rails guides:

    
    
      $("<%= escape_javascript(render @user) %>").appendTo("#users");
    

This uses jQuery, but you can all imagine how to do this with vanilla js and
it works so well.

------
adamstep
Congrats on the launch! As a big user of Intercooler, I'm curious about which
features you considered mistakes, or which ideas didn't work out as well as
you expected. My own library Hyperview is heavily inspired by Intercooler, so
I'm hoping to learn from your experience!

~~~
recursivedoubts
heya adam

Here are some off the top of my head:

\- the dependency mechanism (too magical)

\- the ic-action attribute (sometimes it's OK to write some javascript)

Generally I'm trying to reduce the number of attributes and add a bit of
syntax if necessary, e.g. kt-trigger="every 1s" vs. a separate ic-poll
attribute.

Also I'm trying to make it pluggable so that people can add their own
functionality rather than pressuring me to add a new attribute or feature. :)

Hyperview is an awesome library btw, everyone check it out:

[https://hyperview.org/](https://hyperview.org/)

Hypertext: the once and future king.

------
aruggirello
To all users of unpoly, intercooler / kutty: which one would you recommend for
a new e-commerce project? I'm especially concerned by maintainability issues,
as well as possible SEO implications.

------
kfk
Would this work with an html table element? I am building online pivot tables
and I like the idea of building the entire table on the server and swapping it
with a div on user click.

~~~
recursivedoubts
Yep. Here's an example showing a table that updates and flashes a color
depending on the operation:

[https://kutty.org/examples/bulk-update/](https://kutty.org/examples/bulk-
update/)

~~~
ComputerGuru
Hey just some feedback. The UX there is wrong because there is instant
feedback in the toggling of the activate/deactivate button but a slight delay
in the reaction time for the selected row (due to the round trip). I believe
the correct paradigm here is for the button to not toggle state until the
response is received/acted upon (to indicate a short “hang”).

------
purerandomness
Intercooler/Kutty is truly a remedy to modern web development's accidental
complexity.

Love it, thank you for putting so much effort into it!

------
jslakro
This make me think how related are intercooler and knockout, functionality is
quite similar

------
skrebbel
Super nice! Feels a lot like a manual version of Phoenix LiveView. That's a
good thing!

------
deanstag
FYI, Kutty or കുട്ടി means child in the language of malayalam :)

~~~
recursivedoubts
I like that a lot more than what it means in Dutch!

------
rebataur
awesome, we use intercooler.js, would explore this for future projects.

