Milos Zikic - Personal site, sharing thoughts about startups, products and engineering

Using low-power servers to host php sites (e.g. Amazon Micro instance)

First answer should be DON'T or better said understand your needs and then decide.

It really falls down to what are the expectations and if the site you are planning to run is not having 10s of thousands of visits daily you can probably utilize some of the low power servers available out there. Amazon is great for starting it up since it provide you with one year free tier option. You will have to leave the credit card info with them though since they might be some other charges in the future usage and Amazon would like to be able to charge for it.

So important things:

  • Do not expect to much
  • If you can separate web server and db server (maybe 2 micro instances)
  • If you can use nginx instead of apache web server. Nginx comes with much lower memory footprint.
  • Go with some lighter site frameworks (e.g. your own or wordpress). Drupal or Typo3 will take up a lot more resources.
Here are some recommended values for apache (httpd.conf)
Timeout 30 #Set this to some reasonable amount - who waits more then 30 secs for site to load?

StartServers 3
MinSpareServers 2
MaxSpareServers 1

MaxClients 6
MaxRequestsPerChild 500

We are not allowing many concurrent requests here but it will limit the apache memory consumption so other processes may run. If you do not have intensive operations that require a lot of memory for php processes you should put some small amount for php memory_limit in php.ini

memory_limit = 64M #maximum amount of memory one php process can consume

And if you run MySQL or similar on this server monitor it for usage. If your MySQL process gets killed (Amazon has a watchdog that will do this automatically if there is no more free memory) you may adjust the apache configuration values to even lower values.

Conclusion: if you run some small blog or personal page this configuration will run smoothly for you and will provide you with snappy performance. If you have more then 1k unique visitors a day think of something different (or pay for small ec2 instance).

OS X Finder open in path shortcuts for various Apps (ITerm2, Sublime Text 2, Vim)


While using Finder app a lot of times I need to open a terminal in the current path. Yes you can get info of the folder you are in, select path and then launch terminal and past the path... (sloooooow) :(

Luckily I found a neat useful app to open Terminal app in finders path. Since I am ITerm fan I tried to dig out more and found a script that can launch ITerm in path as well. You can find it here.

In order to make the use of this you will need to create application with the help of Automator. Just paste it to automator, click save and voila or download the apps I already bundled.

There are couple of more apps that I like using it this way so I created few more scripts and bundled apps for it:

  • ITerm 2
  • Sublime Text 2
  • MacVim
  • Vim
And here is how to install these sweeties:

  1. Download source code from bitbucket project (or clone it)
  2. Select apps you want and move application files to your Applications folder (e.g. /Applications)
  3.  Then pick up the application icon and drag it to finders toolbar
  4. There you go.. all set up.. enjoy!
Go ahead fork me up and add apps that you like using as well.

Update 2013/03/20:
Source code along with binaries available now on github as well  

JDK 1.7 on Mac OS X and in various IDEs

Hey JDK 1.7 is out for a while and here is how to use it in your favorite IDE.

But first you need to download JDK 1.7 OS X Preview. Follow the installation instructions and your JDD 1.7 installation should finish up in

/Library/Java/JavaVirtualMachines/1.7.0.jdk/Contents/Home/


Eclipse

  • Edit your eclipse.ini
    vim /Applications/Eclipse.app/Contents/MacOS/eclipse.ini

  • Add before first line:
    - vm
    /Library/Java/JavaVirtualMachines/1.7.0.jdk/Contents/Home/bin/java

NetBeans

  • Edit your netbeans.conf
    • "vim /Applications/NetBeans/NetBeans\ 7.1.app/Contents/Resources/NetBeans/etc/netbeans.conf"
  • Change netbeans_jdkhome to
    netbeans_jdkhome="/Library/Java/JavaVirtualMachines/1.7.0.jdk/Contents/Home"

6/15/2012 - Update:
This worked before official 11 release. Idea changed how they handle JDKs and they are depending on Apples JDK to run.
You can use Oracles JDK 1.7 for running any projects in IDEA however, but you cannot run IDEA itself. 

IntelliJ IDEA

  • Edit your Info.plist
    vim /Applications/IntelliJ\ IDEA\ 11.app/bin/idea.sh

  • Add to the top:
    IDEA_JDK=/Library/Java/JavaVirtualMachines/1.7.0.jdk/Contents/Home

  • Save and run IDEA by
    cd /Applications/IntelliJ\ IDEA\ 11.app/
    ./bin/idea.sh


Comments

Miloš Žikić
This worked before official 11 release. Idea changed how they handle JDKs and they are depending on Apples JDK to run.

You can use Oracles JDK 1.7 for running any projects in IDEA however, but you cannot run IDEA itself.
Archimedes Trajano
How would you do the change on IntelliJ IDEA 11 CE?

I don't have a bin/idea.sh file in there

Distributed version control is natural way of thinking

Every day I get amazed with afraid looks in developer eyes when I mention working with distributed version control systems. These systems are now very mature and present for a long time and todays developers should feel confortable trying things out.

...BUT reality is very different. Since there are not many enthusiast out there experimenting every day, being passionate about software and focusing on their work in big enterprises I get the situation. I do not think this is good.

.. Yes yes I know it is expensive for an enterprise to upgrade some technology. There are banks out there still having their system on Java 1.2 with no upgrade plan (and of course there are many exams relaying on Cobol). And ok thats fine.

...BUT again we leave in a rapid changing world. We want to be productive and more efficient every day. We want to improve. We are engineers we move forward every day.. or at least some of us do.

I want to encourage positive thinking and educate people over the things I find useful and productive. DVCS are the thing to go.

WHY?

Because DVCS implemented natural human thinking behavior. Our thought BRANCH. They branch very often, and then we return and rethink what we have done and branch to other direction, and then rethink again and again branch and then we come to conclusion. Potentially not the best one but with a big chance to be the best one simple because we have been experimenting with different paths.

That is what distributed is all about. Experiment as much as you like. Branch whenever you need, be creative, productive and efficient.

What are the causes for not accepting this not so new movement? Developers learned to think as the machines worked and now when we managed to make machines work as we think not all of us have evolved to that level.

Do you remember working with MS SourceSafe? No? Good for you. I never personally used it (when I didn't had to) but have worked on educating many developers migrate from it.

LOCKS!

Developers love locking. You lock your file and work on it. So you are the only owner of the file and no one else is not interfering your work. Great in some world, but inefficient, slow and I am not thinking of indirect impact that this revision system caused to poor development teams that were not used to playing good in teams. They all worked in their own world. Their were thought and encouraged to work like that. Thats bad..

Somehow we all managed to overcome this and got used using SVN and merging files become normal.

BUT! SVN (and similars) are central systems. Whatever you want to do to you have to do it over server. Ok it is not the problem because internet is available everywhere. But why will you share all your mindmapping and your experiments with all other developers? Ok even if you want to share it, thats fine, but that is simple bloating the repository since it will be garbage for others but for you valuable process of thinking. And this process is slow! Branching in SVN is slow, comparing changes, listing history (arrrghhh I can scream at the thought of this again) ... all of this needs to go through the central repository.

So you try to overcome all of this and think linearly and keep working with constraints that are not natural to your mind and you transfer that limitations to your code. You do not let your mind play and explore. You do not search for great solutions, but instead just go with the flow, find the shortest path. Thats bad..

And then came DVCS. This is what we needed from the start, but machines were not ready, as machines evolved and our understanding of the ways how to interact with them evolved mankind came up with a way to allow developers work as their brains work, not imposing limitations but instead encouraged experiments. Then github came and made distributed a cool thing and others followed: bitbucket, gitorius, etc.. (I am more a Mercurial guy but do not mind git.. they are both great).

BUT! Enterprises didn't follow and this is bad thing! Enterprises do not realize how much are they loosing. Productivity is suffering. Employees are limited, they are not exploring, not finding better solutions. This should change. Everybody needs to move forward. Its in the nature of mankind. And trust me Mercurial is easy to setup in the enterprise and set up all permission models very similar to SVN so just go ahead an try it.

WHY should I bother?

DVC allows you to experiment. Start working on something, realize that you might do it differently, go back couple of steps start going to different direction, realize that you have a better way, and again go back and do it. Then merge something that you liked about your other work, cherry pick some part that you liked. And then you want to share with others. Its simple, pick what you want to share, share just some branches, rebase your changes and compact them to one change set. Remove the clutter for others. Its very very very easy.

And it gets even better!

You have multiple ways of sharing. E.g. you have a central push repository but during your work you want to share some pre alpha code with your coworker thats working on other part of the functionality. There is still no need to push this code to central and you SHOULDN'T. Share it by publishing it to your friend (multiple options here: shared folder, email, web server) and work together, exchange prepare the code and then push it to central. As you see easy and not limiting at all.

I strongly believe that DVCS make better software engineers, and those that are having trouble working this way are NOT welcome to my team. Unset your limits and let your minds free!

Using different fill colors for positive and negative values in AreaChart

Recently I have been playing with Flex AreaChart component and wanted to have different color fills for positive and negative values. This is not available out of the box and in order to achieve this new areaRenderer needs to be created.


I found great forum thread that tackles similar thing (http://forums.adobe.com/message/3005273) and this component needed few improvements to have good stroke colors on negative side as well. 


The biggest challenge was the part where line drops from positive to negative value and should change colors in between values and vice versa. Luckily there is renderedBase property available that holds info where is the zero point and with a little bit of trigonometry we can find out where are the important points where we need to split the line and draw different colors.


And at the end here is the code:


AreaChartRenderer:

package 
{

import flash.display.Graphics;
import flash.geom.Rectangle;

import mx.charts.chartClasses.GraphicsUtilities;
import mx.charts.renderers.AreaRenderer;
import mx.graphics.IFill;
import mx.graphics.IStroke;
import mx.graphics.SolidColor;
import mx.graphics.SolidColorStroke;

public class AreaChartRenderer extends AreaRenderer
{

private var strokePositive:uint = 0x127625;
private var strokeNegative:uint = 0xCC2800;

private var fillPositive:uint = 0x127625;
private var alphaPositive:Number = 0.2;
private var fillNegative:uint = 0xCC2800;
private var alphaNegative:Number = 0.2;


private static var noStroke:SolidColorStroke = new SolidColorStroke(0, 0, 0);

/**
* @private
*/
override protected function updateDisplayList(unscaledWidth:Number, unscaledHeight:Number):void
{
super.updateDisplayList(unscaledWidth, unscaledHeight);
if (!data)
{
return;
}


var fill:IFill = null;
var stroke:IStroke = null;

var form:String = getStyle("form");

var g:Graphics = graphics;
g.clear();



var boundary:Array /* of Object */ = data.filteredCache;
var n:int = boundary.length;
if (n == 0)
{
return;
}

var xMin:Number;
var xMax:Number = xMin = boundary[0].x;
var yMin:Number;
var yMax:Number = yMin = boundary[0].y;

var v:Object;

// loop through items and prepare fills
for (var i:int = 0; i < n; i++)
{
v = boundary[i];

xMin = Math.min(xMin, v.x);
yMin = Math.min(yMin, v.y);
xMax = Math.max(xMax, v.x);
yMax = Math.max(yMax, v.y);

if (!isNaN(v.min))
{
yMin = Math.min(yMin, v.min);
yMax = Math.max(yMax, v.min);
}

//middle values
var x1:Number, y1:Number;

if (boundary[i + 1] != null && boundary[i].item.value > 0 && boundary[i + 1].item.value < 0)
{
// we have a transtion from positive to negative. We need to break this down to 2 areas for filling

// determine middle point

// y middle point

y1 = data.renderedBase;

x1 = Math.sqrt(Math.pow((boundary[i + 1].x - boundary[i].x), 2) * Math.pow((y1 - boundary[i].y), 2) / Math.pow((boundary[i + 1].y - boundary[i].y), 2)) + boundary[i].x;

// color positive
fill = new SolidColor(fillPositive, alphaPositive);
stroke = new SolidColorStroke(strokePositive);


fill.begin(g, new Rectangle(xMin, yMin, x1 - xMin, y1 - yMin), null);
GraphicsUtilities.drawPolyLine(g, boundary, i, i + 2, "x", "y", noStroke, form);
g.lineTo(x1, data.renderedBase);
g.lineTo(boundary[i].x, data.renderedBase);
g.endFill();

// positive stroke
drawStroke(g, boundary, i, stroke, form, x1, y1);

// color negative
fill = new SolidColor(fillNegative, alphaNegative);
stroke = new SolidColorStroke(strokeNegative);

fill.begin(g, new Rectangle(x1, y1, xMax - x1, yMax - y1), null);
GraphicsUtilities.drawPolyLine(g, boundary, i, i + 2, "x", "y", noStroke, form);
g.lineTo(boundary[i + 1].x, data.renderedBase);
g.lineTo(x1, data.renderedBase);
g.endFill();

drawStroke(g, boundary, i, stroke, form, boundary[i + 1].x, boundary[i + 1].y, x1, y1);


}
else if (boundary[i + 1] != null && boundary[i].item.value < 0 && boundary[i + 1].item.value > 0)
{
// we have a transtion from negative to positive. We need to break this down to 2 areas for filling

// determine middle point

// y middle point

y1 = data.renderedBase;

x1 = Math.sqrt(Math.pow((boundary[i + 1].x - boundary[i].x), 2) * Math.pow((y1 - boundary[i].y), 2) / Math.pow((boundary[i + 1].y - boundary[i].y), 2)) + boundary[i].x;


// color negative
fill = new SolidColor(fillNegative, alphaNegative);
stroke = new SolidColorStroke(strokeNegative);

fill.begin(g, new Rectangle(xMin, yMin, x1 - xMin, y1 - yMin), null);
GraphicsUtilities.drawPolyLine(g, boundary, i, i + 2, "x", "y", noStroke, form);
g.lineTo(x1, data.renderedBase);
g.lineTo(boundary[i].x, data.renderedBase);
g.endFill();

drawStroke(g, boundary, i, stroke, form, x1, y1);

// color positive
fill = new SolidColor(fillPositive, alphaPositive);
stroke = new SolidColorStroke(strokePositive);


fill.begin(g, new Rectangle(x1, y1, xMax - x1, yMax - y1), null);
GraphicsUtilities.drawPolyLine(g, boundary, i, i + 2, "x", "y", noStroke, form);
g.lineTo(boundary[i + 1].x, data.renderedBase);
g.lineTo(x1, data.renderedBase);
g.endFill();

drawStroke(g, boundary, i, stroke, form, boundary[i + 1].x, boundary[i + 1].y, x1, y1);
}
else
{

if (boundary[i].item.value > 0)
{
fill = new SolidColor(fillPositive, alphaPositive);
stroke = new SolidColorStroke(strokePositive);
}
else
{
fill = new SolidColor(fillNegative, alphaNegative);
stroke = new SolidColorStroke(strokeNegative);
}


if (i < n - 1)
{
fill.begin(g, new Rectangle(xMin, yMin, xMax - xMin, yMax - yMin), null);
GraphicsUtilities.drawPolyLine(g, boundary, i, i + 2, "x", "y", noStroke, form);
g.lineTo(boundary[i + 1].x, data.renderedBase);
g.lineTo(boundary[i].x, data.renderedBase);
g.endFill();


drawStroke(g, boundary, i, stroke, form);
}
}
}



}

/**
* Draws a line with a given stroke between 2 points. It either uses boundary point array or start and end points
*
*
*/

private function drawStroke(g:Graphics, boundary:Array, i:int, stroke:IStroke, form:String, endX:Number = NaN, endY:Number = NaN, startX:Number = NaN, startY:Number = NaN):void
{

if (isNaN(startX))
{
g.moveTo(boundary[i].x, boundary[i].y);
} else {
g.moveTo(startX, startY);
}

var colorStroke:SolidColorStroke = stroke as SolidColorStroke;
g.lineStyle(colorStroke.weight, colorStroke.color, colorStroke.alpha);

if (boundary[i].element.minField != null && boundary[i].element.minField != "")
{
g.lineTo(boundary[i + 1].x, boundary[i + 1].min);

GraphicsUtilities.drawPolyLine(g, boundary, i + 1, i, "x", "min", noStroke, form, false);
}
else
{
if (isNaN(endX))
{
g.lineTo(boundary[i + 1].x, boundary[i + 1].y);
}
else
{
g.lineTo(endX, endY);
}
}

g.endFill();
}
}
}


And here is the final result:

Happy charting!

Comments

Miloš Žikić
Hi there,
Complete source code for the renderer is available in the blog post. Copy the class and apply it as your itemRenderer.

A little bit about chart item renderers can be found at Adobe help pages:

http://help.adobe.com/en_US/flex/using/WS2db454920e96a9e51e63e3d11c0bf69084-7c52.html
Anonymous
Hi,

Could you please post your example with source code so that we can run on flex builder.

Thanks in advanced
Miloš Žikić
This way it is more fun :)

Since lines are continuous when having 2 lines on the chart (negative and positive) when they are not bellow or above the zero line they will be running through the zero line axis which will not look good.
Anonymous
Hi

Why not just use the yValue to determine the profit and loss values and create a seperate profitArray and lossArray. Draw two seperate polyLine with different color and stroke. Wouldn't that be a cleaner solution?

Regards
Ashwin
Miloš Žikić
Hi there,

I think that you can do the same as I did with AreaRenderer extend the BarCharts BoxItemRendeder (if you are using this) and in similar fashion overriide updateDisplayList method.

http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/mx/charts/renderers/BoxItemRenderer.html#protectedMethodSummary

I suppose that you can use the same check to see if you are above or bellow some value :

if (boundary[i + 1] != null && boundary[i].item.value > 0 && boundary[i + 1].item.value < 0)

Let me know if you managed it!

Cheers,
Miloš
Miloš Žikić
This comment has been removed by the author.
Anonymous
Hi,

I have a similar problem. I have a bar series to be plotted. I use a itemrenderer to colour the bar either red or green depending on the xvalue is greater than zero or less than zero. I need every single bar in that bar chart(both green and red) to have two different shades. If the bar crosses a cutoff limit then it should be indicated using a slightly different red or green on both negative and positive side. Any solution for this? Thanks