outaTiME

at devel days

Archive for November 2007

20071103-outaTiME, clubbers-vol.3

without comments

Written by outaTiME

November 30, 2007 at 2:51 pm

Posted in Clubbers

Tools for Detecting Memory Leaks

with one comment

Hi everyone,

As many web devs know, it’s relatively easy to build a site which results in memory leaks when viewed in Internet Explorer. IE team members have written MSDN articles on leak patterns, and other sites have posted articles with varying tone, depending on the author’s frustration with the problem.

These memory leaks often occur as a result of circular references between Jscript objects and objects within IE’s DOM (document object model). Since the Jscript engine and IE have independent memory management schemes, each side can’t see the entire cycle of these circular references.

Internet Explorer 7 improved the situation by releasing all references to Jscript objects attached to the DOM tree when IE navigates away from that page. This allows the Jscript engine to then garbage collect those Jscript objects and recover that memory. We’ve also made the same changes in IE6 on Windows XP SP2 (shipped originally with the June Update). However, as some web developers have pointed out, those changes don’t solve the problem entirely. IE still leaves behind anything not attached to the tree when we tear down the markup. In addition, sites that users keep open for extended periods of time, such as Web-based mail, can still cause IE’s memory usage to continually grow if the site doesn’t take care to avoid the leak patterns.

So no, it’s not perfect, but we’re also continuing to invest in improvements for future versions of IE.

In the meantime, tools and best practices can help web developers find and remove leaks today.

Drip and sIEve (joint SourceFourge site) are two such tools. Many of you may already be familiar with them, but a little extra visibility never hurts. Both applications host Trident – IE’s rendering engine – and add detection of memory leak patterns. They let you track memory and DOM usage while using a site and then detect any leaks when you navigate away from that page. Drip is an open source project under the BSD license. Based on Drip, sIEve improves the usability in a few ways including non-modal dialogs and a real-time graph of DOM usage instead of memory usage. If you have questions/comments about the tools themselves, try the documentation, forum, or mailing list. And if you’re interested in taking a more active role in the project, contact Matthias Miller through the forum or mailing list.

Those tools will you help find the leaks, and here are a few articles that provide more information about removing them, or better yet, avoiding them in the first place:


Thanks!

John Hrvatin
Program Manager
Internet Explorer

(Via IEBlog.)

Written by outaTiME

November 30, 2007 at 9:25 am

Posted in Development, Javascript

Run IE on your Intel Mac, if you absolutely have to

without comments

If you’re a Mac-based web developer, a sysadmin at SomeBigCo, or an Outlook Web Access user, you might find yourself needing to use MS Internet Explorer from time to time. No, not IE for Mac OS X, frozen in amber within Applications folders around the globe; I mean IE for Windows, the hairy scary Active-X enabled browser that for better or worse represents a huge chunk of the web-surfing world.

Getting ‘real’ IE on the Mac, up until now, has meant OS emulation (Virtual PC), virtualization (Parallels/VMware), API emulation (Wine/CrossOver) or remote access (RDC). Now there’s another option for Intel Mac owners: ies4osx, a Mac port of the ies4linux package. Built on top of the Darwine version of the Wine IA32 API emulation layer, ies4osx downloads and installs an official version of IE (you pick from v5, 5.5, 6 or 7) and then runs it inside the X11 environment on your Mac.

The resulting browser looks a little weird — almost like a Bizarro version of IE, with the slightly altered type and menu look of the X11 windowing system — but this bear can dance. OWA runs nicely, with full rich-text editing and message search, and the administration pages for MS Virtual Server also work pretty well. I wouldn’t depend on ies4osx in a production role, at least not with the current build, but for one-off testing of websites in IE it’s worth the (free) download. The ies4linux developer plans to roll the Mac-specific fixes back into the main package, so the next version of ies4 will probably support both Mac and Linux users from the same codebase.

(Via The Unofficial Apple Weblog (TUAW).)

Written by outaTiME

November 30, 2007 at 9:21 am

Posted in Applications, MacOS

Google Gadgets on your Dashboard

with one comment

A question everyone asked when we launched Google Desktop for the Mac was: where are the gadgets? Today, we have an answer: they’re in your Dashboard! Now there’s a new feature for Google Desktop, Google Gadgets for the Mac, which is ready to install. With this launch, we’re bringing hundreds of Google Gadgets to the Mac OS X platform. You can take advantage of gadgets to do things like browse YouTube videos, nurture a virtual flower pot, or even check your day’s agenda in Dashboard.

Not only that, the new Google Gadgets applications let you add gadgets with one click and interact with them beside your Apple widgets in Dashboard. There’s an automatic update to the gadget list each week, so you’ll always have something new to look forward to.

Watch the Gadget application in action:

Attention, gadget/widget developers: this launch makes it possible for you to write your gadget once and have it run on a Mac, a PC, and any webpage on the Internet. Learn more about how to write a cross platform gadget.

(Via Official Google Blog.)

Written by outaTiME

November 29, 2007 at 8:08 pm

New CSS JavaScript Library

with one comment

Marat Denenberg has continued the trend of CSS frameworks by taking Mootools and creating CSS.js.

The library sits on top of CSS itself and gives you:

  • Programmatic CSS
  • Browser Compatibility
  • Custom CSS Properties

With programmatic css, you can use loops to generate CSS that might have taken pages to type out. You can have CSS constants. You can do all sorts of math and calculations for a property. You can also modify the style of elements on the fly, without using javascript on each element. I’m sure there’s other cool stuff you can do that I didn’t think of.

Browser compatibility is sort of self-obvious. Before, you used to have a style sheet for each browser to allow for their quirks and weird CSS implementation. Now you can generate CSS that is browser specific using JS. The class is built to allow you to extend it for any browser and any property. You can specify a property to be limited, in which case it will only generate it for the browser you specify.

Ever wanted to invet your own CSS property? Now you can. See the examples for what I mean.

There are a lot of great examples, such as having IE grok opacity:

JAVASCRIPT:

  1.  
  2. CSS.implement({
  3.     ‘trident_opacity’: function(value, property)
  4.     {
  5.         return [‘filter’, ‘alpha(opacity=’ + (value * 100) + ‘)’];
  6.     }
  7. });
  8.  

or allowing you to use border-radius and have it setup for the right browser:

JAVASCRIPT:

  1.  
  2. CSS.implement({
  3.     local:
  4.     {
  5.         limited: [‘border-radius’]
  6.     },
  7.  
  8.     ‘gecko_border-radius’: function(value, property)
  9.     {
  10.         return [‘-moz-’ + property, value];
  11.     },
  12.  
  13.     ‘webkit_border-radius’: function(value, property)
  14.     {
  15.         return [‘-webkit-’ + property, value];
  16.     }
  17. });
  18.  

Download CSS.js

(Via Ajaxian.)

Written by outaTiME

November 29, 2007 at 12:07 pm

Posted in CSS, Development, Extensions

Genfavicon: A favicon generator

with one comment

Adding to the long list of generator-style sites is the latest addition called Genfavicon.

Using jQuery for it’s DOM manipulation and Ajax work, the site actually does a pretty decent job of creating the cool little favicons used throughout the web. You have the option of either specifying a URL for the image you’d like to convert or uploading it to the site for processing. Once loaded, the full image is presented in a neat cropping pane letting you decide which section of the image you want as your favicon. Once you’re ready, just choose an image size between 16×16 through 128×128, click the “Capture & Preview” button and download your favicon. Pretty painless.

The site was created by the group at Ferca Network as a pet project. If you can read Spanish, you can get more details via their blog.

(Via Ajaxian.)

Written by outaTiME

November 29, 2007 at 12:01 pm

Posted in Development, Extensions

MooTools Calendar Component

without comments

We just featured SCal, and now we have a MooTools Calendar component created by Aeron Glemann.

I have tried to make Calendar as semantic as possible–with proper usage of CAPTION, THEAD, TBODY, TH and TD elements–and lots of CSS styling hooks. View the Calendar stylesheet for examples of the CSS; see the Styling Your Calendar section in the Manual for references to the XHTML.

You create the beast via:

JAVASCRIPT:

  1.  
  2. myCal1 = new Calendar({ date1: ‘d/m/Y’ }, { direction: 1 });
  3. myCal2 = new Calendar({ date2: ‘d/m/Y’ }, { classes: [‘dashboard’, … ], direction: 1 });
  4. myCal3 = new Calendar({ date3: ‘d/m/Y’ }, { classes: [‘i-heart-ny’, … ], direction: 1 });
  5.  

And you end up with some pretty stuff:

Mootools Calendar

(Via Ajaxian.)

Written by outaTiME

November 28, 2007 at 6:36 pm

Mad Cool Date Library

without comments

Ok, I’ve seen some cool libraries in my time but I’ve just found one that is ssssooo cool that I didn’t want to wait to post about it until tomorrow (sorry Dion!).

So I get this email from a bud asking me to check out this date handling library and I’m figuring “great, Yet Another Date Library”. So I jump on over to Datejs.com to check it out and I’m presented with a nice looking site. I mean the little ninja dude at top is pretty slick! Anyways, I digress.

I start reading up on it and I see the usual pitch:

Datejs is an open-source JavaScript Date Library.

Comprehensive, yet simple, stealthy and fast. Datejs has passed all trials and is ready to strike. Datejs doesn’t just parse strings, it slices them cleanly in two.

Read that before, must be the same ole, blah, blah. So I look for like a date picker or something and all I see is a text box. Hmm. I see some suggestions listed below it:

So I give it a go and…woah!

Okay, lucky try. I know if I try that t+5years, it’s gonna choke.

Holy cow!!! All I have to say is wow. This is a VERY cool date library and definitely unique. I’ve not seen anything like this.

Datejs is the brainchild of Geoffrey McGill and the team at Coolite. It was developed to handle both parsing, formatting and processing of dates within the JS language. Apart from its incredible parsing capabilities, it also supports a TON of different language formats!

All 150+ CultureInfo files have been pre-compiled and are available within the same /build/ folder as date.js. Each culture file includes translations for many of the strings used in the Datejs library. Some strings have not been translated, although will be filled in over time as the community contributes.

The widget does a complete Date.parse(text) on each keystroke. Notice that no ‘date format’ is passed into the Parser. The Parser figures everything out on it’s own.

The API is also so simple to use. I mean just look below at the code examples. It doesn’t get much easier then that:

// What date is next thursday?
Date.today().next().thursday();

// Add 3 days to Today
Date.today().add(3).days();

// Is today Friday?
Date.today().is().friday();

// Number fun
(3).days().ago();

// 6 months from now
var n = 6;
n.months().fromNow();

// Set to 8:30 AM on the 15th day of the month
Date.today().set({ day: 15, hour: 8, mintue: 30 });

// Convert text into Date
Date.parse(‘today’);
Date.parse(‘t + 5 d’); // today + 5 days
Date.parse(‘next thursday’);
Date.parse(‘February 20th 1973′);
Date.parse(‘Thu, 1 July 2004 22:30:00′);

Overall, Datejs is REALLY impressive and I’m definitely going to see where I can use it in. Datejs is released under the MIT License and available for download at GoogleCode.

(Via Ajaxian.)

Written by outaTiME

November 28, 2007 at 9:57 am

Posted in Development, Javascript

Safari CSS Reference

without comments

Do you want to have one place that tells you about all of the Safari properties?

Now we have it.

The reference shows not only the standard properties and how Safari handles them, but also all of the -webkit-* properties such as -webkit-border-top-right-radius:

WebKit Border Property

(Via Ajaxian.)

Written by outaTiME

November 28, 2007 at 9:56 am

Posted in CSS, Development, Safari

Firefox 2.0.0.10 stability update now available for download

without comments

As part of Mozilla Corporation’s ongoing stability and security update process, Firefox 2.0.0.10 is now available for Windows, Mac, and Linux for free download from http://getfirefox.com.

We strongly recommend that all Firefox users upgrade to this latest release. If you already have Firefox 2.x, you will receive an automated update notification within 24 to 48 hours. This update can also be applied manually by selecting “Check for Updates…” from the Help menu starting now.

For a list of changes and more information, please review the Firefox 2.0.0.10 Release Notes.

If you are still running Firefox 1.5.0.x, you are highly encouraged to upgrade to the Firefox 2 series as Mozilla ceased supporting Firefox 1.5.0.x in May 2007. Simply choose “Check for Updates…” from the Help menu to begin the upgrade process.

(Via Mozilla Developer News.)

Written by outaTiME

November 27, 2007 at 9:54 am

Posted in Firefox, Releases, Security