DOM

An is­sue popped up on Twitter this past week that caused the web site to be gen­er­al­ly unus­able for many users. It ap­pears as if at­tempts to scroll were un­bear­ably slow and caused the site to be un­re­spon­sive. The Twitter team in­ves­ti­gat­ed and de­ter­mined that if they re­vert­ed the ver­sion of jQuery that they used back to 1.4.2 from 1.4.4 the site would be re­spon­sive again. After more in­ves­ti­ga­tion they de­ter­mined that the code that was slow was do­ing a con­tex­tu­al se­lec­tor search for an item (...)

With so many new de­tails sur­round­ing the CSS3 re­lease it can be dif­fi­cult for de­vel­op­ers to ful­ly grasp all of the changes. With the evolv­ing na­ture of the web we’re al­so see­ing great ad­vances in web­site struc­tures, file for­mats, units, and even in­te­gra­tion with HTML5 at­tributes. These trends will grow in­to the great­est it­er­a­tion of the World Wide Web we’ve ev­er seen! Although there is too much ma­te­ri­al to cov­er all topics we will be dis­cussing some of the ma­jor im­prove­ments to CSS3. Many new (...)

Twice a mon­th, we re­vis­it some of our read­ers’ fa­vorite posts from through­out the his­to­ry of Nettuts+. Implementing AJAX tech­nol­o­gy can be a hit or miss thing. Do it well and you’ll have users rav­ing over the slick­ness it pro­vides to the gen­er­al user ex­pe­ri­ence, while, if you mess it up, you’ll be at the re­ceiv­ing end of their wrath. Here are 24 tips to guide through the pro­cess of im­ple­ment­ing AJAX tech­nol­o­gy with­in your web ap­pli­ca­tion. 1. Understand What it All Means First up, you (...)

Forget trans­forms, na­tive video, se­man­tic tags and all the other frivolous HTML5 non­sense; web work­ers are the best fea­tures to ar­rive in browsers since JavaScript! Web work­ers fi­nal­ly al­low de­vel­op­ers to run on­go­ing pro­cess­es in a sep­a­rate thread. Threading sounds com­pli­cat­ed and some de­vel­op­ment lan­guages make it tricky, but you’ll be pleased to hear that JavaScript’s im­ple­men­ta­tion is good and the W3C work­ing draft is stable. Web work­ers of­fer huge client-side per­for­mance gains, but there (...)

In my pre­vi­ous posts, we ex­am­ined JavaScript Execution and Browser Limits and a method which can solve “un­re­spon­sive script” alerts us­ing Timer-Based Pseudo-Threading. Today, we’ll look at ways to han­dle large vol­umes of data with­in the browser. A few years ago, de­vel­op­ers would nev­er have con­sid­ered al­ter­na­tives to com­plex server-side pro­cess­ing. That per­cep­tion has changed and many Ajax ap­pli­ca­tions send huge quan­ti­ties of data be­tween the client and the server. In ad­di­tion, code may up­date (...)

You can nev­er have too much of a good thing–and two good things we re­ly on in our work are tips and tricks. Nuggets of in­for­ma­tion, pre­sent­ed clear­ly and suc­cinct­ly, help us build so­lu­tions and learn best prac­tices. In a pre­vi­ous ar­ti­cle, we shared a jam-packed list of 250 quick web de­sign tips. It seems on­ly right to con­tin­ue the trend by show­cas­ing 100 fresh–and hope­ful­ly use­ful–CSS tips and tricks. General Not ev­ery­thing in this list was easy to cat­e­go­rize. All of the tips that are (...)

Writing good and main­tain­able javascript is hard, espe­cial­ly when your first javascript frame­work was jQuery. Couples of years ago, you could be ok us­ing doc­u­ment.ready for im­ple­ment­ing your min­i­mal fea­tures. Now not so much, web ap­pli­ca­tion use more and more javascript, and there comes a time where us­ing anony­mous func­tions with a ton of events is just not enough. jQuery is pret­ty good at han­dling ev­ery­thing cross-browser, but is does noth­ing to help you im­ple­ment a clean ar­chi­tec­ture (...)

With a blog it’s great get­ting com­ments, but as any blog­ger need to re­al­ize, there are other chan­nels that peo­ple like to ex­press their re­ac­tions in to – espe­cial­ly Twitter. Background Therefore, I want­ed a nice way to im­ple­ment re­ac­tions on Twitter to my blog posts, so ev­ery­one read­ing could see it all in the same con­text. Some time ago (may­be a year) I found the BackType Connect plug­in for WordPress. All good and well, till it stopped work­ing a few months ago. I went through all of my (...)

Allow me to in­tro­duce the bug triage team with a chart: Over the past 60 days, the bug triage team has tak­en an un­wieldy hairy mess of tick­ets and ad­dressed ev­ery sin­gle one of them. Yes that’s right; as it stands, there are ze­ro un­re­viewed tick­ets in the jQuery is­sue track­er. The last one to be closed was a rather malodor­ous bug. The jQuery Bug Triage team are a group of jQuery core and com­mu­ni­ty mem­bers who ac­tive­ly as­sist in nar­row­ing down and patch­ing bugs sub­mit­ted on the jQuery (...)

jQuery is great for en­hanc­ing a web­site. Whether it be by adding ef­fects that give the site a wow fac­tor, or by mak­ing nav­i­ga­tion easier, jQuery can have a big im­pact on the way a web­site is per­ceived and used. jQuery is ex­treme­ly pop­u­lar among web de­sign­ers and de­vel­op­ers for it’s flex­i­bil­i­ty, ease-of-use, and of course it’s plu­g­ins. So for this post, we’ve round­ed up 10 more jQuery plu­g­ins and tech­niques that you should find very use­ful. Supersized 3.0 Plugin This plug­in pro­duces a full (...)

jQuery 1.4.4 is now out! This is the fourth mi­nor re­lease on top of jQuery 1.4 and lands a num­ber of fix­es for bugs in­clud­ing some nice im­prove­ments over 1.4.3. We would like to thank the fol­low­ing com­mu­ni­ty mem­bers that pro­vid­ed patch­es, in­put and their time to­wards this re­lease: Rick Waldron, Dan Heberden, Alex Sexton, Colin Snover. Along with the fol­low­ing mem­bers of the jQuery core team: John Resig, Dave Methvin, Karl Swedberg, Paul Irish. We al­so thank our bug triage team who (...)

Two9A writes "JavaScript has shed its im­age of be­ing a lim­it­ed lan­guage, tied to DOM ma­nip­u­la­tion in a browser; in re­cent years, new engi­nes and frame­works have given JS a rep­u­ta­tion as a lan­guage ca­pable of big­ger things. Mix this in with the new ele­ments of HTML5, and you have the ca­pac­i­ty to em­u­late a game con­sole or other sys­tem, with full graph­i­cal out­put. This series of ar­ti­cles looks in de­tail at how an em­u­la­tor is writ­ten in JavaScript, us­ing the ex­am­ple of the Gameboy hand­held: (...)

When work­ing on a web ap­pli­ca­tion that in­volves a lot of JavaScript, one of the first things you learn is to stop ty­ing your data to the DOM. It’s all too easy to cre­ate JavaScript ap­pli­ca­tions that end up as tan­gled piles of jQuery se­lec­tors and call­backs, all try­ing fran­ti­cal­ly to keep data in sync be­tween the HTML UI, your JavaScript log­ic, and the database on your server. For rich client-side ap­pli­ca­tions, a more struc­tured ap­proach is help­ful. With Backbone, you rep­re­sent your data as (...)

Until re­cent­ly, play­ing video files in a web page was no­to­ri­ous­ly com­pli­cat­ed. The user re­quires a Flash or Silverlight plug-in and even the sim­plest HTML is a con­fus­ing mess: <ob­ject width="320" height="240"> <param name="movie" val­ue="myvideo.swf" /> <em­bed src="myvideo.swf" width="320" height="240"></em­bed> </ob­ject> Few HTML5 fea­tures ex­cite de­vel­op­ers more than na­tive au­dio and video. (...)

In the tech world, the so­lu­tions we find are on­ly as good as the prob­lems they solve. I just love the irony here. What re­solves an is­sue one day may ac­tu­al­ly on­ly be mask­ing the symp­toms of a big­ger com­pli­ca­tion. Let me elab­o­rate … Scripting and Loading When I first start­ed pro­gram­ming JavaScript, around 1999, no­body was think­ing much about the syn­chro­niza­tion of com­po­nents as they load. We put all our script­ing in the <head> sec­tion, and tied ev­ery­thing in­to win­dow.on­load. We did it (...)

Today, JavaScript take a lead­ing place when it comes to client side pro­gram­ming and is used by pro­fes­sion­als and web de­vel­op­ers all over the world. JavaScript is a pow­er­ful lan­guage with many ad­vanced fea­tures and frame­works like jQuery, YUI, SproutCore and Cappuccino. But it has cer­tain dis­ad­van­tages that JavaScript is not the same in all browsers and it lim­its and ac­ces­si­bil­i­ty of a web­site. But the­se fac­tors should not lim­it the ca­pa­bil­i­ties of this won­der­ful lan­guage. Working with (...)

During a sick day a few weeks ago, I got around to some­thing I’ve been mean­ing to look at for about a year: LESS. If any­thing web tech­nol­o­gy is worth a look, I promise LESS is. In this ar­ti­cle, we’ll look at the amaz­ing pow­er of LESS and its abil­i­ty to stream­line and im­prove your de­vel­op­ment pro­cess. We’ll cov­er rapid pro­to­typ­ing, build­ing a lightweight grid sys­tem, and us­ing CSS3 with LESS. Getting Started: What We’ll Be Using For this tu­to­ri­al, I will be us­ing the PHP LESS (...)

Posted by RobOusbey This post be­gins with a par­tic­u­lar dilem­ma that SEOs have often faced: web­sites that use AJAX to load con­tent in­to the page can be much quick­er and provide a bet­ter user ex­pe­ri­ence BUT: the­se web­sites can be dif­fi­cult (or im­pos­si­ble) for Google to crawl, and us­ing AJAX can dam­age the site's SEO. Fortunately, Google has made a pro­pos­al for how web­mas­ters can get the best of both worlds. I'll provide links to Google doc­u­men­ta­tion later in this post, but it boils (...)

I want­ed to round up a bit my thoughts about this year Boston jQuery con­fer­ence. If you had a look at the talks de­scrip­tions you cer­tain­ly saw that there were a lot of talks about code or­ga­ni­za­tion, unit test­ing, tem­plat­ing and etc. It seems this year has re­al­ly been the year where ex­pe­ri­enced jQuery de­vel­op­ers want­ed to evolve out­side the DOM that jQuery is so good at ab­stract­ing. It cer­tain­ly feels weird, when you think about it, that this year con­fer­ence was all about adding com­plex­i­ty (...)

Calendars can be seen fre­quent­ly in most web pages to­day espe­cial­ly in blogs and per­son­al web­sites. As for cor­po­rate sites or e-com­merce sites, it is uti­lize to lay­out an­nounce­ments, up-com­ing events, con­test and much more. What makes a cal­en­dar al­most essen­tial? It al­lows users to know what is new, what to be ex­pect on spec­i­fied date and track back old­er in­for­ma­tion all at one glance. Calendar in hotel, cin­e­ma or air­li­nesí web­site re­quires user’s in­ter­ac­tion to re­serve rooms and air (...)