2013-04-29

Dart Part 2 - Classes

Classes are a common structure in many programming languages. They are used to arrange code into logically related groupings. In object oriented programming the idea is that each class represents a thing. This thing may be a real world object like a Book or a thing which operates on a book like a BookSorter. Much like the other languages at which we’ve looked Dart has support for classes and also for full inheritance.

Here you can see Book has a descendant class TextBook which adds the additional edition field. Just like CoffeeScript and TypeScript there is syntactic sugar to allow for setting of public properties from the constructor. In this case the “this” keyword us used to denote what should be set. Interestingly on line 18 we have access to the edition information even though the instance was created as a Book and not a TextBook. This would not be possible with a language like C# or Java.

Dart has an interesting feature which is a built in factory method. Factories can be used to construct objects in a non-initialized way. Basically it is a way of overriding construction. Honestly it is a useful pattern but it isn’t one which I use so frequently that I feel the need to have my language support it. But perhaps you’re different.

In this example I retrieve the book from HTML5 local storage instead of creating a new book.

2013-04-26

Dart Part 1 - Another New Hope

In preparation for my upcoming talk about next generation JavaScript I’ve been looking atalternativesto writing pure JavaScript. Largely my discussion is predicated on the idea that JavaScript isn’t great for building large applications. As others have suggested JavaScript is the assembly language of the web. So far I’ve looked at TypeScript and CoffeeScirpt, today bring Dart into the mix.

Wraith Darts - sorry, Google, these are still coolerWraith Darts ““ sorry, Google, these are still cooler

Dart is a product of Google and having been announced in October of 2011 it is fairly mature. When it first came out the compiler for it was terrible and produced the most verbose JavaScript imaginable. It was unfortunate because it was soundly mocked for being junk. I seem to remember that a hello world application compiled to over 1000 lines of JavaScript code. Things are greatly improved now and Google recently announced that the JavaScript emitted by the latest compiler, dart2js, runs faster than hand written JavaScript. That’s quite an achievement considering the crazy lengths to which browsers go to optimize JavaScript.

What’s interesting about Dart, which makes it different from the other two languages we’ve looked at, is that you can actually run dartnativelyon Chrome. There is no need to compile it to JavaScript first. Well no need assuming that everybody who uses your site runs a special build of Chromium. However, I hear that the new Blink rendering engine is going to include support for Dart so there may be a future for native Dart and that future could be very close.

This post’s goal is just to get started with the Dart development tools. Google provide a Dart editor which is based on Eclipse(ugh). So let’s ignore that for now and use the command line tools. Grabbing the install package fromhttp://www.dartlang.org/tools/gives us the editor and the SDK. Within the SDK are a number of tools but we’re interested in dart2js.

It can be run without any flags to produce both the compiled JavaScript and a map file. A real basic bit of Dart like this

prints

0 Hello 1 Hello 2 Hello 3 Hello

The code demonstrates some small part of Dart but nothing too exciting. We’ll get more into Dart in upcoming days.

2013-04-25

Slurp - Source Maps CoffeeScript Part 5

Today I would like to talk a bit about source maps. Back when the world was new and languages like TypeScript and CoffeeScript which transcompile to JavaScript were just poking their heads out of the primordial soup there was no way to trance an error in your JavaScript back to the line of code in the generating language. For simple programs this wasn’t a huge deal because you could squint a bit and figure it out. But as the languages became more powerful and programs more complicated the situation worsened.Fortunatelya hero arose in the form of source maps.

Source maps are about what you would expect: they are a way of translating from one representation of the source to another. In our case from JavaScript to the source language, CoffeeScript. These maps can be consumed by the browser and the output shown in the debugging consoles in Chrome and FireFox. As source maps are still a bit new you may need to enable them manually before you make use of them. In Chrome, my development browser, this can be done by hitting F12 the clicking on the little cog icon in the bottom right corner of the developer tools. Under sources there is a check box for Enable source maps

Enabling source mapsEnabling source maps

Next up is telling the CoffeeScript compiler to generate source maps too while it is compiling. That is just a question of including the -m flag

coffee -m -c test.coffee

You will now see that the compiler does two things. First it emits a .map file which is the mapping from JavaScript back to CoffeeScript. Next it adds the line

/ //@ sourceMappingURL=test.map /

To the bottom of the generated JavaScript file. That’s pretty much it now. I tested mine out with a little bit of mildly complicated CoffeeScript

This generates output which is pretty different from the input so source mapping is handy

In Chrome now I see not only the JavaScript but also the CoffeeScript when I jump into the source view. I’m able to set break points on the CoffeeScript and execution will actually stop there allowing me to debug CoffeeScript directly instead of guess at the source CoffeeScript line.

Breaking on CoffeeScriptBreaking on CoffeeScript

Pretty nifty! You can actually use source maps to map minified JavaScript too, you can even use multiple layers of maps to translate from minified JavaScript -> full JavaScript -> CoffeeScript. Not every minifier has support for this butUglifyJS certainly does.

2013-04-24

Slurp Deconstruction CoffeeScript Part 4

Welcome to part 4! This is the first part which is divisible by 2 but isn’t equal to 2. Of course that wouldn’t be true if I started my blog series at 0. Son of a gun ““ you just wait for the next series.

Deconstruction are one of my favorite features of CoffeeScript. Deconstructions allow for rapid assignment of variables or rapid remapping on complex objects. The simplest case is the old interview question of how to swap two variables.

This isn’t limited to only two items either, you can do anarbitrarynumber

Nifty but not all that useful, right? Not so fast my part 4 friend. Using this technique we can easily supportmultiplereturns from a function which is really the dream. Frequently you want to return complex data from a function but don’t want to waste time building a bunch of data transfer objects

Just. Like. That.

It can also be used to expand object like the options hash which is commonly passed in when building jQuery plugins.

See? That’s why part 4 is all about the fun of deconstructions.

2013-04-23

Slurp - Operators CoffeeScript Part 3

CoffeeScript brings a number of renamed and new operators to your JavaScript. The first one is our old friend ==. JavaScript has two equality operators == and ===. The difference is that == will not perform type conversion before performing the comparison. That has the result of allowing really strange things to be true

Fortunately CoffeeScript clears this weirdness up by masking JavaScript’s == and introducing its own == operator which compiles to ===.

Confused yet? It’s a lot of =s that’s to be sure. To maintain consistency with the conversational tone of CoffeeScript you can use English words in place of the standard operators. For instance that == can be written as is.

Taken from the CoffeeScript documentation

CoffeeScriptJavaScript
is===
isnt!==
not!
and&&
or||
true, yes, ontrue
false, no, offfalse
@, thisthis
ofin
inno JS equivalent
In addition to being able to use the operators as one would in JavaScript one can use nifty post statement branches.

The final goodie for today is the existential operator. It is represented using the ? symbol. It can be used to check to see if a value is null or undefined.

A more impressive use is in operator chaining

You can’t tell me that isn’t a far cleaner and easier to understand syntax.

2013-04-22

Slurp - Looping CoffeeScript Part 2

There are a couple of different approaches to looping in CoffeeScript. The designers of CoffeeScript felt that the majority of loops are really just iterating over a collection. Thus the majority your looping needs can be served using a for-each style loop. The syntax for doing so looks about how you would expect

Here we have a loop over the trees in theforest. Pretty easy. What if I really need to know the index of the element on which I was operating? Unlike for-each loops in many languages which assume that the index of and element in an enumeration in meaningless CoffeeScript offers a way out

By passing in a secondparameterto the for loop you can gain access to an element which contains the index. If you don’t have a collection but wish to execute some operation multiple times you can either use a for loop syntax on a range or use a while loop.

For loop with range:

While loop:

Perhaps the coolest feature of loops in CoffeeScript are that you can perform filtering on the elements as youiterateover them. If I only wanted to perform an action on my forest when the tree was birch then I can create an implicit if by doing

Now let’s say that the trees in the forest are a bit more complex that before and we wanted to filter on a property, that’s no problem:

Loops are much more powerful in CoffeeScript than in pure JavaScript. I think the syntax is also more readable.

2013-04-19

Slurp - CoffeeScript Part 1

I’m doing a couple of talk at Prairie DevConin Winnipeg in early May. One of them is about data visualizations and the other is about next generation JavaScript. This is the first time I’ve talked about JavaScript in front of an audience which actually knows about JavaScript. Scary.

CoffeeScriptis a language which compiles down to JavaScript instead of some binary language. In that way it is not unlike TypeScript about which I have written a few things.To get started the easiest thing to do is download and install node.js from their site. Node provides an implementation of the V8 JavaScript engine which can be run headless and it includes the npm package manager. Once you have node installed it is as simple as running

npm install -g coffee-script

that will even add CoffeeScriptto your path. What a friendly fellow that node package manager is! If you’re running this on OSX or Linux and you want to install it globally (that’s what the -g flag does) then you’ll need to have sudo.

We can now get started with a simple CoffeeScriptprogram. By convention CoffeeScript files end in .coffee but for maximum confusion you should end them with .java or .c (please don’t). The lengthening of file extensions is kind of funny, don’t you think?

.c -> .cpp-> .java -> .coffee -> .heythisisajavascriptfile

So let’s start with a really simpleCoffeeScript program.

I’ve spoken before about how to arrange large code bases using namespaces and classes. CoffeeScript doesn’t have a built in concept of namespace or module but it does have a concept of classes. You can simulate modules but that’s a lesson for another day, classes will do just fine for now.

The first thing you’ll notice is that the syntax is different from JavaScript. CoffeeScript uses a python style syntax which means that whitespace is important. The constructor keyword creates a constructor which takes a single parameter name. You’ll notice that name is prefaced by an @ symbol. This makes name an automatically assigned property.

Here you can see the syntax for setting up ifs and elses. Again notice the lack of braces, code blocks are denoted by indentation.

Over the next week I’ll be delving more into coffeescript in preparation for my talk.

2013-04-18

A Spike on SQL Server Backups

I frequently feel that if there is a hole in my knowledge of my development stack it is SQL Server. Honestly the thing is a mystery to me for the most part. I put data in it and data comes out. From time to time I add an index and data comes out faster. Sometimes I look at query plans but mostly I do that in front of other developers so they believe that I know SQL Server. I tell you looking at a query plan then tapping your monitor with a pen and going “yep, yep” gives you a lot of street cred in development shops.

Street CredStreet Cred

But my lack of understanding of SQL Server backups ends this day!

Okay so the first thing is that there are 3 different recovery modes for SQL Server: Simple, Full and Bulk logged.

Simple -In this mode no log files are backed up only a snapshot of the data. This mode means that there is no need to keep transaction log files around. However if you lose the database then you also lose all the data since your last backup. Depending on your use case this might be okay but I doubt it. I would, personally, stay away from simple recovery mode.

Full ““ The log file is backed up in this version which means that you can recover up to the last transaction. In addition you can stop the restore at any point, essentially giving you a snapshot of the database at any point in time. That’s pretty awesome for many applications which are not even disaster recovery related.

Bulk logged -This is a special case of full backups which allows for better performance by not logging the details of certain bulk operations. For the most part this mode is as recoverable as the previous but saves you space if you make use of a lot of bulk operations. You probably shouldn’t make use of a lot of bulk operations anyway.

Great that clears things up, except: what’s a transaction log?

A transaction log is an append only file which contains a record of every transaction, or change, which occurs on a SQL server. Information is written during the lifetime of a transaction which means that if the sever crashes it can finish up or roll back half finished transactions using the log. Replaying a full log can restore a database. The log can also be shipped to other instances which can replay the log to bring themselves up to date. You might want to do that if you have a number of read only mirrors of your database for scalability or high availability purposes.

As you might imagine these log files can grow out of control pretty quickly.Fortunatelyyou can truncate them from time to time. From what I’m reading the log file is truncated as soon as it has been backed up. However the log file may not actually be reduced in size. This is because allocating disk is expensive so SQL server keeps hold of what is, in effect, an empty file. If you really need the space back you can run

DBCC SHRINKFILE (‘YourDataBase_Log’, 1000)

There are also some corner cases where the log file will not be truncated during a backup ““ such as when a restore is running using that transaction log.

The log file should be stored on a different disk from the mdf file. And when I say a different disk I mean a different storage systementirely. So if the mdf is on a SAN then the log file shouldn’t be on that SAN unless you’re willing to lose data should the entire SAN fail(hey, it happens).

2013-04-17

Building Your Source Controlled Access Database

Last week I published an oddly popular post about version controlling access databases. Could be that other people are also responsible for maintaining an access database? Let’s pause for a moment and sigh collectively.

<>

If you read this blog with any frequency(hi, mom!) then you’ll know that I’m big on producing automatic builds. I’m not the only one, it is even part of the Joel test. How can we get access to build from the source files automatically? Unsurprisingly it turns out it sucks.

Because the source files are separated from the compiled database something needs to assemble the files into the accdb file. In an ideal world the assembly would be done by a command line build tool. No such tool exists. I tried to create one but I ended up deep in a COM hole attempting to call the source control bindings in Access without having to open up the UI. Turns out that this COM stuff, which largelydisappearedbefore I started programming on Windows, is kind of hard. I backed away from thatapproachand instead I made use of a UI automation library called White.

White is an open source project which I believe came out of Thoughworks back in the day. Since then it has been picked up a group of people known as TestStack. There was a flurry of activity when they first started maintaining the tool but that’s died of since. I’ll do a more in detailed post on White and how to use it at a later date.

Unfortunately, I can’t release everything I did to get Access to build the sourcecontrolledversion of my database as myemployerisn’t big on releasing things through open source. I think I can get away with some general hints, though.

The first thing is to launch Access without any flags which, once you’ve included White.Core looks like

var application = Application.Launch(@”c:Program Files (x86)Microsoft OfficeOffice14MSACCESS.EXE”);

Then you basically just drive the UI as if it were you at the keyboard. Selecting a ribbon tab requires using the Window.Tabs collection and firing a Click event on the appropriate tab, in this case Source Control. Then it is just a question of selecting Create from Team Foundation and driving the rest of the UI.

With this approach I could easily generate the required accdb file. I haven’t got there yet but I’m going to tie the building application into TFS as a build step so that full packages can be generated.

2013-04-16

Setting up a PhoneGap Development Environment

There’s probably already a zillion posts out there about how to set up a PhoneGap development environment on OSX. I wanted my own because I did it once and now I’ve forgotten how. Typical idiot thing to do.

First download the Android Development Tools from here. There are some installation instructions but they basically amount to “run unzip”. This bundle include eclipse and a swack of Androidy stuff. I moved the contents to a Tools directory, because that’s how I roll.

In to that directory I also put the latest version of phone gap. At the time of writing that was 2.6.0.

I added all the tools directories to my PATH in .bash_profile

echoexport PATH=${PATH}:~/Tools/sdk/tools:~/Tools/sdk/platform-tools:~/Tools/phonegap/lib/android/bin

Here if there was a need to do iOS I would replace android in the last part of the path with ios. Or, perhaps it is opposite day and BlackBerry is a popular platform with a strong future then do s/android/blackberry/. But, let’s be honest, if it’s opposite day then I’m a Russian oil billionaire and I’m probably out hunting with Putin.

That's me, on the right.That’s me, on Putin’s right.

It is kind of a pain that the scripts to create PhoneGap projects are all named the same but just in different directories. If I were making a lot of new apps then probably I would just alias a ton of them instead of adding to my path.

alias create-ios=~/Tools/phonegap/lib/ios/bin/create alias create-android=~/Tools/phonegap/lib/android/bin/create alias create-hahahaha=~/Tools/phonegap/lib/blackberry/bin/create

That’s pretty much it. New projects are created by running the create script and then pointing eclipse at the folder.