JavaScript is evil
Wilfred Nas
Front end developer
JavaScript is

Evil
Wilfred Nas
JavaScript developer
@wnas
When all you have is a hammer.
Semantics
<div
aria-labelledby="tweet-box-minihome-profile-label"
id="tweet-box-mini-home-profile"
class="tweet-box rich-editor noti...
<textarea>
</textarea>
Users
That’s who you should think about...
Focus on the
information
Not the presentation
Ceci n'est pas une pipe
<div id="userctrl_sticky_0"
style="position: absolute; cursor:
pointer; z-index: 40; left: 44px;
top: 24px;"><div
style="o...
<button
id=”moveToTheLef
t”>Go
left</button>
Bad things
without JavaScript
No navigation
Vanishing
elements
Plain stupid!
Good things
No carousels
No cookie
warnings
Be Lazy
Write less code
Be fast
Write less code
Be
accessible
Write less but smart code
Be
simple
Write smart code
Be reusable
Just be smart
Make great things
And think about your mothers...
any questions? @wnas
Javascript is evil - fronteers 2013 jam sessions
Javascript is evil - fronteers 2013 jam sessions
Javascript is evil - fronteers 2013 jam sessions
Javascript is evil - fronteers 2013 jam sessions
Javascript is evil - fronteers 2013 jam sessions
Javascript is evil - fronteers 2013 jam sessions
Javascript is evil - fronteers 2013 jam sessions
Javascript is evil - fronteers 2013 jam sessions
Javascript is evil - fronteers 2013 jam sessions
Javascript is evil - fronteers 2013 jam sessions
Javascript is evil - fronteers 2013 jam sessions
Upcoming SlideShare
Loading in …5
×

Javascript is evil - fronteers 2013 jam sessions

2,325 views

Published on

as more and more people rely solely on javascript to build sites and pages, I tell people what is evil about javascript.

Not the language itself, but seeing it as the only solution.

see me give the talk over here:

http://vimeo.com/77588600

Published in: Technology
0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total views
2,325
On SlideShare
0
From Embeds
0
Number of Embeds
13
Actions
Shares
0
Downloads
3
Comments
0
Likes
0
Embeds 0
No embeds

No notes for slide
  • when all you have is a hammer
  • everything looks like a nail. I remember when I first saw node.js, my mind was blown away. Now I could do everything without those pesky java developers. But what i see now is that some people completely forget the html side of things and just build div’s in div’s enhanced with javascript. When you do everything with JavaScript all you end up with is div&apos;s.
  • I don&apos;t want JavaScript developers, I want WEB developers! I want people not just doing great JavaScript work, I want people building a great web. And that web is being build with content, HTML, CSS, urls and JavaScript
  • that’s what i’m talking about. about being proud of your work, not about being a smart ass.
    I want us all to be proud of every little aspect of your work, take proud in chosing just the right element for the job, not all div’s.
  • Why use an input if you can build one with div&apos;s and spans. (Show example from twitter)
    I think that this is a whole lot of work for this:
  • no comment
  • and slow connections, not just no javascript. but slow javascript, that let’s me wait. I could wait in the old days when I had a 14k4 modem, but nowadays I am spoiled by my speed at home and expect the same thing on the road. not doable you say? I don’t care, just make it so. I am a user and not bound in my expectations by technical limitations you impose on me. When you decide that you need javascript to make a button, you disrespect me.
  • because the (or some of) reason(s) for doing stuff like that is that we want to have it the same in every browser, I mean, come on. this isn’t 2004 anymore, right. we know better than that...
  • we don’t have to care as much about the way it looks as we have to care about the way it works!
  • We could build these tiny buttons with some nice and semantic elements right, but what do we do when we focus not on the information? once you start building from javascript and not from html, you fall into the trap of making these ‘buttons’ into:
  • I mean, come on, I won’t do it. I’m to frigging lazy and I don’t want to put all that effort into something I can make easier with:
  • no more script to make things get focus, not to mention keyboard support and such.
  • so what are the bad things about no javascript? A lot, but I’ll keep it down to two examples I found easily enough.
  • Sometimes the navigation vanishes...
  • I can do that with javascript.
    the sad thing is that this is a recent redesign. when I started researching for this, all that didn’t work were the hover menu’s, which is stupid, but I could buy me all the books or stuff I wanted...
  • I do want to spend me some money here, I really want that...
  • because some elements are very hard to create without javascript...
  • With JavaScript, is there anything you would expect not to work here?
  • Without JavaScript I can’t decide where to go from and where to. I know and love the autocomplete function, but I don’t need it. I would be more than happy if this came back and told me of a spelling mistake and try it again. but no...
  • I made this a bit smaller, as I was told that it was too harsh. I still think that not caring about your users makes you a stupid developer. sorry, but that is what I think. Some of the decisions are defendable i’m sure, but in the end, you would know that you’d rather made ‘m differently...
  • but on the other side, there are good things when we don’t have javascript. just two examples like before. it is a jam and only 10 minutes after all...
  • you know those really obnoxious things where everybody gets to be on the home page?
  • I can do all of the things I want to here, I guess, didn’t had the time to really test it though.
  • and with javascript, we have marketing fluff and a big ass image I don’t care about. In fact we have three of ‘m and that is not all that much...
    (I build way worse than this )
  • there is this law here, ask me later.
  • but it makes every website have you agreeing with the cookies they set for different reasons.
  • not without javascript here, win/win situation as far as I care.
  • if you use the right elements for the job, no div, you can focus on the important things, the focus stuff and so on are taken care of...
  • less code goes over the line faster, make sure your users have a page waiting for them and enhance it later on...
  • remember what I said about the accessible part? making that by yourself is hard work, better let the browser take care of that in the first state of your page...
  • not emulating a browser, aka accessibility and such makes your live way easier
  • a div that has some action is very hard to explain to some other developer. a button has a meaning and can be understood by others
  • try and build a web for everyone, not just ourselves.
    Remember, we who build the web are not it’s most typical users...
  • Javascript is evil - fronteers 2013 jam sessions

    1. 1. JavaScript is evil Wilfred Nas Front end developer
    2. 2. JavaScript is Evil Wilfred Nas JavaScript developer @wnas
    3. 3. When all you have is a hammer.
    4. 4. Semantics
    5. 5. <div aria-labelledby="tweet-box-minihome-profile-label" id="tweet-box-mini-home-profile" class="tweet-box rich-editor notie" contenteditable="true" spellcheck="true" role="textbox" aria-multiline="true" dir="ltr" aria-autocomplete="list" aria-haspopup="true" aria-controls="typeahead-dropdown-7" ><div><br></div
    6. 6. <textarea> </textarea>
    7. 7. Users That’s who you should think about...
    8. 8. Focus on the information Not the presentation
    9. 9. Ceci n'est pas une pipe
    10. 10. <div id="userctrl_sticky_0" style="position: absolute; cursor: pointer; z-index: 40; left: 44px; top: 24px;"><div style="overflow:hidden;width:18px;h eight:18px;"><img id="userctrl_2" title="Schuif naar rechts" src=" [pathto]/img.png" style="marginleft: -49px; margin-top: 0px;"></div></div>
    11. 11. <button id=”moveToTheLef t”>Go left</button>
    12. 12. Bad things without JavaScript
    13. 13. No navigation
    14. 14. Vanishing elements
    15. 15. Plain stupid!
    16. 16. Good things
    17. 17. No carousels
    18. 18. No cookie warnings
    19. 19. Be Lazy Write less code
    20. 20. Be fast Write less code
    21. 21. Be accessible Write less but smart code
    22. 22. Be simple Write smart code
    23. 23. Be reusable Just be smart
    24. 24. Make great things And think about your mothers... any questions? @wnas

    ×