Some stuff about Web and .NET development
RSS icon Email icon Home icon
  • In bulk #2

    Posted on July 15th, 2009 Thibaut No comments

    Share/Save/Bookmark

  • What’s wrong with innerHTML ?

    Posted on April 24th, 2009 Thibaut 1 comment

    Every javascript developer knows innerHTML, that famous DOM property that allows you to set or get the HTML markup string of an element. It’s easy, it’s fast but it also kinda sucks. Here’s why :

    • It’s not a standard (it was originally introduced by Microsoft some time ago)
    • innerHTML is only a string with no structure. On the contrary, the DOM is a structured tree that allows to manipulate elements in a way cleaner manner. And you can put plenty of errors into that string without even getting a single warning from the Javascript
    • Maintenance is way much complicated if you have to dig into a complex HTML string than just inserting your line between the right CreateElement() methods of the DOM

    // Note how it’s easy with innerHTML to introduce errors

    // In this case, the div tag is not properly closed

    document.body.innerHTML = “<div>Some text</div”;

     

    // Now with the DOM, in a cleaner and more secure way

    var elt = document.createElement(“div”);

    var txt = document.createTextNode(“Some text”);

    elt.appendChild(txt);

    document.body.appendChild(elt);

    But… innerHTML isn’t completely bad though. In fact, it’s way faster than the DOM and is pretty well supported by browsers. So what should you do then ? There are loads of discussions on that topic on the web. In my opinion, you should always strive to respect the standards, which are primordial when you’re working for the web, but this must not slow down productivity either (by making some libraries or helpers for example). Now the big question : What are my alternatives to working with innerHTML ? This very interesting article will perfectly answer to that.

    Share/Save/Bookmark

  • Back from the Techdays

    Posted on March 16th, 2009 Thibaut No comments

    Here is a summary of the sessions I assisted at the Techdays on Wednesday 11th.

    Techdays 09

    Introduction

    • Evolution of software : SOA trend and cloud computing advent
    • Demo of Blend : the graphist and the developer work at the same time on the same project, the graphist makes some modifications and the developer gets the result when launching the app the next time (and vice-versa)
    • Demo of Surface : very impressive, visit the official website to watch the videos. Easy to make apps for surface as that’s WPF with just one lil’ layer onto it
    • Video of Microsoft’s future vision for apps in 2019

    .NET continuum: ASP.NET, AJAX, Silverlight and WPF (by Laurent Bugnion)

    • From the less powerful to the most : ASP.NET, AJAX, Silverlight then WPF
    • Shows how to interact with a WCF service with ASP.NET MVC (postback), ASP.NET AJAX (asynchronous, better UI reaction), Silverlight (only asynchronously, subset of .NET power) and WPF (asynchronous or synchronous, full .NET power)
    • Description of the Model/View pattern
    • Introduction of Dr WPF, a blogger very active in the WPF world

    Silverlight CoreCLR: Bringing the power of .NET to the net (by Andrew Pardoe)

    • Demonstration of the performance of Silverlight, compared to a Javascript application. Chess game, averaging 420,000 nodes per second in Silverlight vs. Javascript at 23,000 nodes per second in the search tree. Complete source code is available for the doubtful guys
    • Anything that can host ActiveX can host CoreCLR
    • Sandboxed execution : one execution domain per Silverlight app. Security increased
    • Same application model between browser and desktop : very easy to port a desktop-WPF app to a browser-Silverlight one
    • Dynamic Language Runtime (DLR) : language interoperability. App written in Python or Ruby can interact with the CoreCLR. Ex : IronPython or IronRuby

    WPF performance & best practices (by Dirk Primbs)

    • First advice about performance : focus on scenario and customer expectations. Do not try all the new visual effects on the same page or it obviously risks to slow down your app
    • The visual tree (containing all the controls and parts of them) can become too large. Use Snoop, a very powerful tool, that enables you to visualize that tree
    • Use optimized controls. For example, the VirtualizingStackPanel instead of the StackPanel, will render its content only when visible (suppose you have a lot of elements, and only a portion of them are visible through scrolling, rendering all of them in your page load isn’t a good solution)
    • Picture processing : try to avoid using large pictures and use caching options such as BitmapCacheOption
    • WPF Performance Suite : great tool for measuring performance of WPF apps
    • Hardware acceleration : 3 tiers (tier 0 : old pc, < DX7, tier 1 : between DX 7 and 9, tier 2 : DX >= 9). App can be set to run at a determined tier to simulate behaviour of less powerful machines and thus tune the perfs of your apps

    Under the hood in Silverlight’s controls skinning framework (by Gill Cleeren)

    • Speaker showed how to create a skin for a button (a purple ellispe with gradient brush)
    • Styling vs. skinning : styling is limited, skinning is completely new look, visual tree and properties
    • Parts & states model : separate logic from visual, contract between coder and designer, supported by Blend. Enables you to add new properties to existing ones on a control
    • Part : the working thing. Eg : a button has no part since the button is itself the part, but in a slider, the part is the little thumb that can be dragged
    • States : the different states of a control, such as mouseover, pressed, etc

    Windows 7 for developers (by Katrien De Graeve)

    • New features for consumers but also for developers
    • Showed the new features for the consumer (the docking features, etc, many articles available on the web about that)
    • Developer point of view : multi monitor support, even when remoting. Problem step recorder : screenshots of every steps of a bug reproduction are taken and then submitted to the developer
    • Compatibility : what works on Vista will work on Win 7 almost for sure

    And that’s all about this very interesting day. See you next year ;)

    Share/Save/Bookmark

  • AJAX tête la première

    Posted on March 4th, 2009 Thibaut 2 comments
    Ajax tête la première Ajax tête la première, or the equivalent in english Ajax head first, introduces you to dynamic and asynchronous UI development. In this book, you will not only learn how Ajax works (XmlHttp, aynchronous requests, callbacks, …) but also how to make effective use of it into your webpages with DOM, JSON, XML, etc… Through multiple application examples, the authors let you put into practise the theory following an interesting incremental approach. Starting with a very basic application, you will add blocks that will transform it into a reactive and modern one, with security issues - such as Sql injection - kept in mind. Below the pros and cons of this book :

    Pros

    • Very clear and well explained book (head first collection reputation)
    • Iterative approach : introduces basic concepts, then new ones through refactoring of previous code examples
    • Originality of examples : surf shop, the chaos project, …
    • Interesting chapter about the Document Object Model (DOM)
    • Also deals with security issues (Sql injection, …)
    • Briefly introduces the main javascript libraries and frameworks, such as script.aculo.usprototype and dojo

    Cons

    • I found the beginning too long (in fact too easy)
    •  Some minor errors in the book, including technical ones

    Conclusion

    I really appreciated this reading, which I found very original and very instructive at the same time. Covered topics, including Ajax basics, Javascript, Xml, Json, Dom and security will give you a strong starting point to go further in Ajax development. A must have.

    Share/Save/Bookmark