Loading presentation...

Present Remotely

Send the link below via email or IM

Copy

Present to your audience

Start remote presentation

  • Invited audience members will follow you as you navigate and present
  • People invited to a presentation do not need a Prezi account
  • This link expires 10 minutes after you close the presentation
  • A maximum of 30 users can follow your presentation
  • Learn more about this feature in our knowledge base article

Do you really want to delete this prezi?

Neither you, nor the coeditors you shared it with will be able to recover it again.

DeleteCancel

Make your likes visible on Facebook?

Connect your Facebook account to Prezi and let your likes appear on your timeline.
You can change this under Settings & Account at any time.

No, thanks

Javascript. Good practices.

No description
by

Bogdan Danilyuk

on 16 November 2013

Comments (0)

Please log in to add your comment.

Report abuse

Transcript of Javascript. Good practices.

Javascript. Good practices.
What is good Javascript?
Code without code smells
Avoid Globals
Good!
Avoid Mixing with Other Technologies
Bad
Good
Good
Bad
Use Shortcut Notations
Bad
Good
Allow for Configuration and Translation
Keep DOM Access to a Minimum
Reason:
It’s slow and there are all kinds of browser issues with constant access to and changes in the DOM.


Solution:
Write or use a helper method that batch-converts a dataset to HTML.

Seed the dataset with as much as you can and then call the method to render all out in one go.
Build on the Shoulders of Giants
Javascript is fun, but writing JavaScript for browsers is less so... start with a good library.
Add Functionality with Javascript Not Content
If you find yourself creating lots and lots of HTML in JavaScript, you might be doing something wrong.

It is not convenient to create using the DOM, it’s flasky to use innerHTML, and it’s hard to keep track of the quality of the HTML you produce.

If you really have a massive interface that should only be available when JavaScript is turned on, load the interface as a static HTML document via Ajax.

That way you keep maintenance in HTML and allow for customization.
Learning JavaScript Design Patterns
http://addyosmani.com/resources/essentialjsdesignpatterns/book/
JavaScript MV* Patterns
MVC
a bit of history ...
The pattern was originally designed by Trygve Reenskaug during his time working on
Smalltalk-80 (1979)
where it was initially called Model-View-Controller-Editor.

MVC went on to be described in depth in 1995's “Design Patterns: Elements of Reusable Object-Oriented Software” (The "GoF" book), which played a role in popularizing its use.
Back to the 80s =)
MVC For JavaScript Developers
Model
View
Controller
Templating
Handlebars.js
Underscore.js
What is controller?
Spine.js
Backbone.js
MVP
MVC vs MVP
MVVM
Model View ViewModel
What the hell is this animal!?
Model
View
ViewModel
TODO MVC
http://todomvc.com/
Thanks!
Full transcript