RSS
 

Archive for the ‘Programming’ Category

jQuery Plugin – Image Radio buttons

12 Oct

At work I’ve written this jQuery plugin. It’s only 2KB big and turns your normal radio buttons into images, you can set any images you like for src, checked and hover. Simply attach the configuration to your html input field as the class attribute as a JavaScript like object. I know you might want to attach a class to your radio buttons, but this is how far it currently is.

Here an example:

Get the JavaScript code
Get the HTML/JavaScript code

Edit: Just found this which seems to make this plugin obsolete. :-( Wish I would have found this earlier…

 

Howto: Install XAMPP 1.7.2 on Windows 7 with XDebug and Netbeans

25 Dec

Hi,

Just for my own reference and some other poor people out there trying to get this to work:

  1. Download XAMPP 1.7.2 from sourceforge.net/projects/xampp/files/XAMPP%20Windows/1.7.2/xampp-win32-1.7.2.exe/download
  2. Install
  3. Download php_xdebug-2.0.5-5.3-vc6.dll from xdebug.org/download.php
  4. Place it in C:\xampp\php\ext
  5. Edit C:\xampp\php\php.ini add:
    zend_extension = “C:\xampp\php\ext\php_xdebug-2.0.5-5.3-vc6.dll”[xdebug]

    xdebug.remote_enable=on

    xdebug.remote_host=127.0.0.1

    xdebug.remote_port=9000

    xdebug.remote_handler=”dbgp”

  6. Enjoy!
 
 

Micro-Optimization For High-Level-Language Programmers

01 Oct

In this post I would like to point out some optimizations that seem to be fairly generic. Every average to advanced level programmer should be able to use these little tricks quite effectively. Code that is well written and thought of can be called great code if it takes advantage of every byte available. However, one should also not overdo optimization, because the gain of 1ms cannot make up for half an hour that you spend more on programming it. But if you get used to using these techniques from now on, you should be good. So lets get to it.

Choosing the right algorithm

… is probably the best optimization you can be doing when writing code. Before you think of saving at the register level, think about how efficient the algorithm is that you are using. For example using quick sort for sorting elements is probably a good idea, rather than using slower algorithms like bubble or insertion sort. If you are using a high-level-language (HLL) like PHP, you would probably want to use the internal *sort() functions. They use quick sort on a low level (written in C). For example, suppose you have an array with 1000 variables (which can be objects, primitives or arrays) and you want to sort it by your own sorting order algorithm. Instead of going through great lengths of searching for an implementation of a sort algorithm online or even writing your own, in PHP, for example, you should use the usort() function and be passing in your compare function. Like this you can sort dates, strings or numbers in any order that you like, you just need to define when item A is smaller than item B and return a negative number in that case, and in the converse return a positive number as well as 0 when they are equal. You get the idea. If you find a good algorithm and need to implement it yourself, it might be hard and challenging but it can be well-worth the time spent on it, because you can save the user of your application time and your application server number crunching resources.

Saving on the byte or even bit level

Now to the more generic optimisations that you can think of when you have chosen the right algorithm for your implementation. When you know that the algorithm you are using is good or even could not be better, great. You can go on implementing it. When you do so, you should think of every expression you use more than once as a variable and also reserve the necessary space for it. For example, you could have an expression like (a < b && b < c && b+2 == d). If you use this expression in only one if statement, it is probably a good idea to use the expression as is. As soon as you use the expression more than once, make a variable that describes the purpose of the expression. For example:

aGreaterBAndBLessCAndBPlus2EqualD = a &lt; b &amp;&amp; b &lt; c &amp;&amp; b+2 == a;

Remember that code readability and understanding of it after the initial implementation is more important than saving a few bytes for the variable name. In compiled languages the length of a variable name does not matter usually. Only in higher level, interpreted languages it can make a difference, but again only nano seconds or so. It is still more important to have an efficient algorithm which is easier to achieve when the code is readable, at least when you later come back to it.

Another trick, which actually follows from the above is to optimise loops in a generic way. A simple for loop like:

for (var i = 0; i &lt; somevar.length; i++) {
  // do something with somevar[i]
}

(in JavaScript) can simply be rewritten as

for (var i = -1, leni = somevar.length; ++i &lt; leni;) {
  // do something with somevar[i]
  // THIS SAVES 20% PERFORMANCE FOR EACH LOOP!
}

This only works if you know ahead of time, that somevar.length will not and need not change inside of the loop, which is mostly the case. This runs faster because somevar.length is re-evaluated every time it is called in every iteration of the top-most for-loop. If you give it a temporary variable the CPU can cache the leni variable in a register and check much quicker if i is smaller than that. I read also that ++i can be faster than i++ in some implementations of programming languages such as JavaScript in some browsers. It depends on how the low-level assembly for that is written. I have seen arguments that i++ and ++i have exactly the same amount of machine instructions, but also ++i is not less readable than i++ and it does not hurt to write it that way if it can cut down the number of instructions by one or two in each iteration.

Edit:
You can use the same concepts in C(++). Actually the book “Write Great Code” talks about C and other lower level languages mainly. In C++ it would look like so, if you want to output a string char by char:

char cstring[10] = "My String";
for (int i = -1, leni = strlen(cstring); ++i &lt; leni; ) {
  cout &lt;&lt; cstring[i];
}

Also, if you want to improve your low-level knowlege, even as a high-level programmer like me, it might pay to read the ‘Write Great Code’ series by Randall Hyde. But in essence these tips here should be sufficient for some improvement of your code and should be simple enough to implement for any level programmer. Just remember that the best compiler or interpreter cannot replace a skilled programmer and I think this will stay that way for a long time if not forever. This is also a good thing and will keep us employed.

I hope someone could learn something from this and you think it was worthwhile to read this short article.

 
 

JavaScript Concepts

06 Aug

Having learned JavaScript mainly by doing, it was quite late that I figured out some important details. Please comment if you think or know that I’m wrong.

The arguments array as well as the caller instance are universal variables inside every JavaScript function. The names are self-explanatory.
An anonymous function inside another function keeps the variables in scope as in:

var somefunction = function(arg1) {
  var avar1 = 10;  
  object.onclick = function() {
    alert('arg1=' + arg1 + ' avar1=' + avar1);
  }
}
somefunction('Foo');
// "arg1=Foo avar1=10" when object is clicked on

So this means that the scope of the function defines what variables can be accessed within it, even after the function call has finished.

Another part I always found confusing in JavaScript is the “this”-keyword, but that might have to be the topic of another post.

 

GeoExt and OpenLayers – Zoom Mode

03 Aug

Just playing around with GeoExt and OpenLayers, I figured out how to easily change the control to a zoom rectangle with minimal changes:

First create the normal and the custom control with:

var inZoom = false;
var navigation = new OpenLayers.Control.Navigation();
var ZoomBoxNav = OpenLayers.Class(OpenLayers.Control.Navigation, {
 zoomBoxKeyMask: null // this ensures that a box is always drawn
});
var zoomBox = new ZoomBoxNav();

Then all you need is a button or better Action object, which adds the appropriate control to the map:

var toggleRectZoom = function() {
  if (inZoom) {
    map.addControl(navigation);
    map.removeControl(zoomBox);
    inZoom = false;
  } else {
    map.addControl(zoomBox);
    map.removeControl(navigation);
    inZoom = true;
  }
}
 
zoomButton = new GeoExt.Action({
  text: 'Zoom Mode',
  handler: function() {
    if (inZoom) {
      zoomButton.setText('Zoom Mode');
    } else {
      zoomButton.setText('Pan Mode');
    }
    toggleRectZoom();
  }
});
 
toolBar = new Ext.Toolbar({
  items: [ zoomButton ]
});
mapPanel = new GeoExt.MapPanel({
  border: true,
  region: "center",
  // we do not want all overlays, to try the OverlayLayerContainer
  map: map,
  center: [172.1569825, -42.6109735],
  zoom: 6,
  layers: myLayers,
  tbar: toolBar
});
 

Thoughts on JavaScript compilers

25 Jul

I think JavaScript compilers sort of defeat the purpose of a programming language. I can understand that you would want to compress JavaScript to save download time on the client side. However, it seems strange to me that another programming language writes code in another, higher level language. If the JavaScript you write is good and not highly redundant, another PL wont be able to generate it. The only place where it seems useful to me is when creating variables’ values like a count or an array of file names or similar. However, generating JavaScript from PHP or any other server side language seems to defeat the purpose of reusable code. You can in fact write highly re-usable code in JavaScript, it supports inheritance etc and libraries like jQuery make it highly compact. When it comes to deployment though, it is beneficial to have a script running that compresses the JavaScript.

Anyway, let me know your thoughts in a comment.