Thursday, January 31, 2013

Microsoft Launches Modern.IE To Help Developers Test Their Web Apps For Legacy And Modern Versions Of IE (link)

Microsoft Launches Modern.IE To Help Developers Test Their Web Apps For Legacy And Modern Versions Of IE.

Read more

Firefox to block content based on Java, Reader, and Silverlight (link)

Mozilla engineers plan to disable Java, Adobe Reader, and Microsoft Silverlight capabilities in their flagship Firefox browser in a move aimed at improving security and performance.

Read more...

Friday, January 18, 2013

@font-face syntax (link)

Here is the best way to define your @font-face:

@font-face {
  font-family: 'XYZ Web';
  src: url('XYZ_web.eot?') format('eot'), url('XYZ_web.woff') format('woff'), url('XYZ_web.ttf') format('truetype');
}
Read here why...

Wednesday, January 16, 2013

Building A Node.JS Server That Won’t Melt (link)

How can you build a Node.JS application that keeps running, even under impossible load?

This post presents a technique and a library that implements that technique, all which is distilled into the following five lines of code:

var toobusy = require('toobusy');
 
app.use(function(req, res, next) {
  if (toobusy()) res.send(503, "I'm busy right now, sorry.");
  else next();
});

Read more...

Coroutine Event Loops in Javascript (link)

Javascript 1.7, currently only available in Firefox, introduces a yield keyword for implementing generators and coroutines. An intriguing use of coroutines is to implement event loops as an alternative to callback functions. This is particularly relevant to Javascript, where the use of callbacks is pervasive.

Read more...

Tuesday, January 15, 2013

The Unreasonable Effectiveness of C (link)

For years I've tried my damnedest to get away from C. Too simple, too many details to manage, too old and crufty, too low level. I've had intense and torrid love affairs with Java, C++, and Erlang. I've built things I'm proud of with all of them, and yet each has broken my heart. They've made promises they couldn't keep, created cultures that focus on the wrong things, and made devastating tradeoffs that eventually make you suffer painfully. And I keep crawling back to C.

C is the total package. It is the only language that's highly productive, extremely fast, has great tooling everywhere, a large community, a highly professional culture, and is truly honest about its tradeoffs.

Other languages can get you to a working state faster, but in the long run, when performance and reliability are important, C will save you time and headaches. I'm painfully learning that lesson once again.

Read more...

How an editable div is made

In my previous post I had shown how you can make a div to receive a focus event. Today I'll show how to make an editable div.

First you can't make a div editable. There's no such thing as an editable div. But a textarea works perfectly for editing. So the idea is to use a textarea for editing and a div for showing text.

Here follows our html code:

    <div id="output">text text text input</div>
    <textarea id="input" style="display: none;">text text text output</textarea>
As you can see we have a div and a textarea. We have assigned id attributes for both. The textarea is hidden by using inline style (display: none;) so that only the div is visible at the start.

The basic idea is to hide the textarea and to show the div then we viewing a text. Then a user clicks on a text we will hide the div and in its place textarea will be shown. We will use jquery library and focus and blur events.

The focus event is sent to an element when it gains focus. This event is implicitly applicable to a limited set of elements, such as form elements (<input>, <select>, etc.) and links (<a href>). In recent browser versions, the event can be extended to include all element types by explicitly setting the element's tabindex property. An element can gain focus via keyboard commands, such as the Tab key, or by mouse clicks on the element.

- JQuery docs

The blur event is sent to an element when it loses focus. Originally, this event was only applicable to form elements, such as <input>. In recent browsers, the domain of the event has been extended to include all element types. An element can lose focus via keyboard commands, such as the Tab key, or by mouse clicks elsewhere on the page.

- JQuery docs

so here follows the javascript code:

<script type="text/javascript">
  $(document).ready(function () {
    $('#output').focus(function() {
      $(this).hide();
      $('#input').height($(this).height())
          .width($(this).width())
          .show()
          .focus();
    });

    $('#input').blur(function() {
      $(this).hide();
      $('#output').html($(this).val()).show();
    });
  });
</script>
So first we find the div element by its id and subscribe it to focus event. In event handler we hide div ($(this).hide();) find textarea by its id and show it. Next subscribe textarea to blur event. In Blur handler we copy textarea text into div then hide textarea and show div again.

That is all, happy coding!

So, You Want to Be a Front-End Engineer, David Mosher (Video)

Some would say that the browser is the most volatile development platform the world has ever known. If you’re a client-side developer, understanding how browser internals work can help you both make better decisions and appreciate the justifications behind many development best practices. In one of the best talks this year, David Mosher takes you through how browsers parse and render your pages.

Go watch video...

Monday, January 14, 2013

Logging is about so much more than failures (link)

If there was one thing that I learned in 2012 that I would want to convey to all the developers I know, it would be this:

Logging is about so much more than failures.
I don’t know if it was just my experience but little to no emphasis was put on logging aside from handling exceptions. In the .NET world this boiled down to adding ELMAH to your project and then forgetting about it, with Rails it meant having nothing but the logs that you got out of the box. I’ve found that if that’s all you have, you’re really missing out.

Read more...

superfeedr.com: we switched to Node.js: the good and the not so good (link)

About a year ago, we introduced our first bits of code that use Node.js: a simple wrapper for our XMPP API. We slowly started to fall in love with Node which had gotten more mature and stable over time. We used Javascript to build our Msgboy and got more and familiar with both the language and the framework.

So, we slowly decided to rewrite all the Superfeedr backend (the website frontend still uses Ruby on Rails). As always, it took us a couple days (litterally) to write the core of it, and months to write all the corner cases. Back in November, everything was ready and deployed.

Read more

Friday, January 11, 2013

Revisiting JavaScript Objects (link)

One of the main focuses of ES5, has been to improve the JavaScript's object structure and manipulation. The features it introduced do make lot of sense, especially if you're working with large and complex applications.

We've been little reluctant to adopt ES5 features, especially due to browser compatibility issues. We rarely see production code that make use of these features. However, all modern browsers (ie. IE9, FF4, Opera 12 & Chrome) do have JavaScript engines that implement the ES5 standard. Also, ES5 features can be used in Node.js based projects without any issue. So I think it would be a worthwhile exercise to revisit the ES5 object features and see how they can be used in real-life scenarios.

Read more...

Thursday, January 10, 2013

The Node Beginner Book

The absolutely wonderful introduction to node.js! Very well written. Really gets you started with developing applications for node.js. Author first shows all possible wrong ways to illustrate the problems and only then the proper way. Examples are very straight forward. Very well explains how node.js and JavaScript are different from a traditional server side languages. If just started with node.js this book is must read for you. Read book online

Monday, January 7, 2013

JavaScript: Clarifying the Keyword ‘this’ (link)

The keyword ‘this’ holds a value and is bound to another object. It can be one of the most confusing subjects in JavaScript. It doesn’t have to be if you follow this simple rule: Read more...

Friday, January 4, 2013

How to make a div to receive focus event

Jest a little tip this time:
Focus doesn't work on div tags by default. But, according to jquery documentation:

The focus event is sent to an element when it gains focus. This event is implicitly applicable to a limited set of elements, such as form elements (, , etc.) and links (). In recent browser versions, the event can be extended to include all element types by explicitly setting the element's tabindex property. An element can gain focus via keyboard commands, such as the Tab key, or by mouse clicks on the element.
So, in order to make focus work on a div you should add 'tabindex' attribute to it. Here follows example:
<!doctype html>
<html lang="eng">
   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
   <style> body div { width: 300px; height: 300px; border: solid 1px black; }   </style>
   <body>
      <div id="output">text text text input</div><br/>
      <input type="text">
      <script type="text/javascript">
         $(document).ready(function () {
            var output = $('#output'); 
            output.attr('tabindex', -1);
            output.bind('focus', function() {
               console.log('Got focus event from div!');
            });
            output.bind('blur', function() {
               console.log('Got blur event from div!');
            });
         });
      </script>
   </body>
</html>
And here follows output of the example:
Got focus event from div!
Got blur event from div!
Got focus event from div!
Got blur event from div!
Got focus event from div!
Got blur event from div!
Got focus event from div!
Got blur event from div!

Thursday, January 3, 2013

NHiberbnate fix added ability to use ToFutureValue with aggregating queries

The new NHibernate Linq Provider patch from Alexander I. Zaytsev added ability to use ToFutureValue with aggregating queries. Here follows the example:

var futurePerson = session.Query<Person>()
.Where(x => x.Id == personId)
.ToFutureValue(x => x.Count()); 
This feature is very useful with pagination for example:
var query = session.Query<Person>();
var countQuery = query.ToFutureValue(x => x.Count());
var page = query.Skip(pageIndex * pageSize).Take(pageSize).ToFuture();
NHibernate release version: 3.3.3.GA.
JIRA issue: NH-3184
Github pull request: #120

Kudos to Alexander I. Zaytsev!