Optimal Handbrake Settings For A Media Library

February 26th, 2009

So let me start by stating that Handbrake settings are not an exact science, as perception of quality varies from person to person. Along with that, optimal Handbrake settings, using the term loosely, also varies from application to application. Settings for output to an iPhone or iPod will differ greatly with settings for output to AppleTV or PS3.

One quick note before we move on to the settings; if at all possible, use a Mac to convert or rip your videos, as the PC version of Handbrake is inferior. I must admit, this may be due to the processors my laptops possess, but in general I have noticed I get quicker and better quality conversions on my Mac. Ok, now on to the settings.

Specs:

IBM ThinkPad T60p, 2.16Ghz, 2GB RAM, Windows XP SP2
MacBook Pro, 2.5Ghz, 2GB RAM, OS X 10.5.6
MacBook, 2.2Ghz, 1GB RAM, OS X 10.5.6

Settings:

Video settings are as follows: extension is .mp4, video codec is H.264, framerate is usually same as source, unless I have to rip a double DVD, in which case I use 23.976, I use average bitrate of 1400 kbps, and I usually try to use Anamorphic Loose, but this totally depends on the source.

hb-video-settings

Audio settings are as follows: source is AC3 5.1 if possible, audio codec is AAC while mixdown is usually Dolby Pro Logic II, samplerate is either Auto or 48, and bitrate is 160, try to always use higher settings on the samplerate and bitrate, you wont regret it later.

hb-audio-settings

Advanced settings are as follows: reference frames are set to 3 or 4, depending on source, mixed references is checked, b-frames is set to 4, (5+ for animations) and weighted b-frames is checked, subpixel motion estimation is 8 or 9, depending on source, analysis is set to all, deblocking is set to -2,-1, and trellis is set to 1 or 2, depending on source, all other settings are default.

hb-advanced-settings

These settings are great for my needs, which are: converting my 500+ DVD library to stored digital media on my NAS, which I play back through my PS3 on my 50″ Samsung 1080p plasma TV. Generally these settings produce a 1.5GB video from a 2 hour DVD. An example output: Braveheart was ripped in 2 hours 30 min on my MacBook Pro, and it produced a high quality video at 2.03GB file. I hardly see a difference on my TV.

What’s nice about these settings is that later on down the road when I want to convert these to iPod or iPhone compatible format, I will have little to modify, and my convert times will be cut dramatically.

And always remember, you can step down in quality, but never step up.

JavaScript Optimization for Page Load Performance

August 27th, 2007

Using techniques like validation, obfuscation, and compression can result in significant decreases in file size, sometimes 50 to 75 percent. Combine that with several other non-pragmatic methods, dramatic improvements in page load performance can be realized.

Care for JavaScript

Building and developing frameworks along with following web standards and some form of a design pattern will help combat against careless coding. Another artifact of building a framework will be more rapid development times and more cohesive packages. At the time of this writing the de facto example of a JavaScript framework is prototype which is protected under open source licenses; MIT and CC-SA (Creative Commons – Share Alike). Caring for the JavaScript also means caring for the HTML it will be run in. Avoid JavaScript only methods that cause the browser to render abnormally, have your code degrade gracefully, if a browser is not JavaScript enabled.

Be Patient with JavaScript

Sometimes it is not necessary to load all the JavaScript in the head of the document or the body onload event. Do not make it standard practice to place all code at the beginning; rather look closely at what code could be placed at the end of the document, at the beginning, or when the page has completely loaded. Delay loading of JavaScript whenever possible, being patient with it will make your browser very happy. And remember to load only what you need. Why load code that is not necessary for the page?

Put JavaScript on a Diet

Once the code is written and the unexpected features have been fixed, you are ready to place your JavaScript on a diet. Remove excess whitespace and comments, use semicolons to break lines in code, and abbreviate variable and object names. This process can be done manually or automatically with vendor packages. Two resources for automatically reducing the JavaScript file size are JavaScript Crunchinator and ESC. Remember to always backup your files before placing it on a diet. To potentially further reduce file size and keep prying eyes from easily reading the source, using an obfuscation tool is recommended. Here is an example of one such tool, you can find many more on the interweb.

Have JavaScript Files Carpool

Roughly 80% of the users’ response time is spent of the client-side. The greater number of JavaScript resources needed in turn produces a greater number of HTTP requests needed. A way to reduce the number of requests is to combine the JavaScript files to a single script. The fewer number of HTTP requests used, the better response time the user will observe.

The Perfect XHTML

May 22nd, 2007

A recent project has forced me to take a closer look at how valid HTML code really is. My task was to improve performance, validate, and standardize the code. In later articles I will discuss my research, development, and conclusions to improving the company’s site performance. But for now, I am going to focus on how to write the perfect XHTML document.

XHTML is a set of document types that reproduce and extend HTML 4, are XML based, and are designed to work with both XML-based and HTML-based user agents. That is, XHTML must conform not only to HTML standards, but conform strictly to XML standards as well.

The differences in HTML and XHTML are strict conformity. A best practice for both standard HTML and XHTML is to conform to one of three DTD’s, Strict, Transitional, or Frameset, and to declare the DOCTYPE. Which can be written as follows:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

The root element of the document must be html, and must contain the XML namespace (xmlns) declaration.

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

According to W3C, its a good idea to have an xml declaration, but it is not required. I personally leave xml declarations for xml only documents.

As said earlier, the major difference between HTML and XHTML is strict conformity, the documents must be well-formed. Elements must be properly nested.

Correctly nested element:

<p>Lorem ipsum dolor sit amet, <i>consectetuer</i> adipiscing elit.</p>

Incorrecly nested element:

<p>Lorem ipsum dolor sit amet, <i>consectetuer adipiscing elit.</p></i>

Because XHTML is interpreted as XML documents, all tags must be lowercase, because XML is case-sensitive. This also pertains to tag attributes as well. It is best practice to create all markup language in lowercase whenever possible.

Correct

<strong>Hello World</strong>

Incorrect

<STRONG>Hello World</STRONG>

XML does not allow end tags to be omitted, thus, all non-empty tags must be closed. If an element is empty, it must be properly closed. The only tag that does not close is the DOCTYPE declaration as it is not part of the XHTML document.

Good

<br />

Bad

<br>

All attribute values must be contained in quotes and minimized attributes are unsupported.

Good

<input checked="checked" type="checkbox" />

Bad

<input checked type=checkbox />

It is best practice to wrap your script content in CDATA elements to avoid parsing of HTML markup such as < and &.

<script type="text/javascript">
< ![CDATA[
// script content here
]]>
</script>

The id attribute is replacing the name attribute in future versions of XHTML. Currently it is best practice to have both named attributes of the same value until future releases of XHTML where then it will be best practice to remove the name attribute all together.

<form id="commentform" name="commentform" method="post"></form>

Today it is standard to have alt tags for images, objects, and buttons. However, not all browsers support the alt attribute, so title is used instead.

<img src='image.jpg' title='My Image' />

As long as you follow these standards throughout your entire document you will have a valid XHTML document.

Creating a PHP Verification Image

March 22nd, 2007

You will need to have GD library loaded on your server, and you should be using PHP4+. To check to see if you have either of these running, simply create a file, call it whatever you want, I call mine info.php. Place the following code in there:

phpinfo();

If all checks out, then you are ready to move on.

Firstly, you will need to create a session, both in your image script, and the page that will be serving the image, you will see why later.

session_start();

And for some, you will have to create a save path for your sessions.

session_save_path('path/to/tmp');

Once you have set this up, you can now start creating your image. Lets start with the variables needed.

$w = 120;
$h = 28;
$x = 6;
$y = 20;
$font = "fonts/arial.ttf";
$font_size = 16;

These variables can be changed to your liking, I chose the basics to get you started. But, for example, you can change arial.ttf to whatever .ttf you like, as long as it is not wingdings, you should be all set.
Next we create the image, and set its background color and text color.

$image = imagecreate($w,$h);
$background_color = imagecolorallocate($image,215,255,255);
$text_color = imagecolorallocate($image,90,90,90);

Now we create our random string for which we set our text to the image for display, and set our SESSION variable.

$str = md5(rand(0,9999));
$output = substr($str, 14, 6);
$_SESSION['verify'] = $output;

With that complete, we move on to applying the random string to the blank image we created earlier.

if(file_exists($font)) {
putenv('GDFONTPATH=' . realpath('.'));
for($i = 0; $i < strlen($output); $i++) {
$ny = rand(200,245)/10;
$angle = rand(-22,19);
imagettftext($image, $font_size, $angle, $x, $ny, $text_color, $font, $output[$i]);
$x += rand(16,18);
}
} else {
die('Font file does not exist.');
}

Now our image has been created, and our SESSION variable has been set, we are almost finished. All that is left is to set our headers, and send the image off.

header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
header("Cache-Control: no-store, no-cache, must-revalidate");
header("Cache-Control: post-check=0, pre-check=0", false);
header("Pragma: no-cache");
header('Content-type: image/jpeg');
imagejpeg($image);
imagedestroy($image);

We do not ever want to cache our images, and we always want to destroy them after we send them.

Now, in whatever page you choose to have this verification work, you simply need to add a session_start(); and in an image tag, point the source to this php file.

<img src="image_verification.php" title="Verify" />

You should be able to figure out the rest when it comes to comparing the user input with the SESSION variable.

Getting cURL to Work in XAMPP

January 22nd, 2007

Simple yet effective.

  1. Go to xampp install directory.
  2. Go to php.ini in php directory.
  3. Open php.ini and find curl, uncomment the first find you see. Save and close file.
  4. Go to php.ini in apache directory.
  5. Repeat Step Three.

Done.

Working With Regular Expressions in JavaScript

October 22nd, 2006

Defining Regular Expression Patterns:

The most common way to define a regexp pattern is to define a variable instance with a pattern you want to match, along with any modifiers you wish to use. This can be achieved with the following:

var pattern = new RegExp("yourpattern", ["g"|"gi"|"i"|"x"]);

Understand that the second parameter is just an example, and not to be applied to all your patterns.

Understanding Modifiers:

Modifiers are parameters that a newly instantiated RegExp class use to define how to parse a particular pattern from its string. The most common modifiers used are g, i, m, x, U, and a combination of g, and i.

g means Global Match, i means Case Insensitive, m means Multiple Lines, x means Allow Comments and White Space in pattern, and U means Ungreedy pattern.

For example, if you wish to match foo in a large document that contained words like Foo, foo, and foobar, you would apply the following pattern:

var pattern = new RegExp("foo", ["g"|"gi"|"i"]);

Modifiers can also be applied with the string you wish to match, like /foo/g or /\s/g

Handling Regular Expression Methods:

There are seven definitive methods most commonly used when handling RexExp and String classes. Writing the pattern is only half the battle, knowing how to use them is the desired end game.

RegExp.exec(string) will apply the RegExp to a string and return an array of matches.

var exec= new RegExp(/foo/i).exec("foo foofighter Foo foobar")

RegExp.compile will take a non literal notation pattern, and compile it to RegExp native for faster execution. No example needed as this method is not used very often.

RegExp.test(string) will return true if the given string matches the RegExp pattern, returns false if not

var test = new RegExp(/foobar/).test("Foo bar foo Bar")

String.match(pattern) will match the string with the given pattern. If the modifier g is applied, it will return an array of matches. If not applied, it will either return the first match, or null for no matches.

var match = "Foobar is a foofighter, foo".match(/(foo)(oo+)/g)

String.search(pattern) will return the numeric beginning of the index of the matched pattern, will return -1 if no match is found.

var search = "Apples and oranges are not foos and bars".search(/foos/)

String.replace(pattern, string) will find the matched pattern and replace it with the supplied string, and returns the newly formed string.

var str = "Foobar is the big foobar.".replace(/foobar/gi, "apples")

String.split(pattern) splits the string into an array, splitting at the matched pattern.

var split = "Foo bar is a great word".split(/\s/g)

Backreferences:

Simple put, backreferences are references to the same variable in a previously successful match. \n where n is any positive nonzero integer telling the engine which successful match to reference. The following code will match any html tag:

var tags = new RegExp(/<(\S+).*>(.*)<\/\1>/)

Character Sets:

Character sets match any of the contained characters, and can be written in ranges. Examples of acceptable patterns are:

var halfchars = new RegExp(/a-l/)
var allnums = new RegExp(/0-9/)
var allcharsnonums = new RegExp(/^0-9/)

Quantifiers:

Quantifiers match the preceding subpattern n number of times. Acceptable subpatterns include, single characters, escaped sequences, patterns enclosed in parentheses, and character sets.

var matches = new RegExp(/o{1,2}/).match("Foobar foofighting toooo many times with the Fockers")

Example Regular Expression Patterns:

Trimming whitespace from the beginning and end of a string would look like the following:

var trim = new RegExp(/^[ \s]+|[ \s]+$/)

Validating an IP address would use the following pattern to capture the group of numbers between each [ . ].

var vip = new RegExp(/\b(?:\d{1,3}\.){3}\d{1,3}\b/)

Matching a date would look like the following

var date = new RegExp(/(\d{1,2}\/\d{1,2}\/\d{4})/)

The following pattern loosely validates email addresses:

var email = new RegExp(/\w@(a-zA-Z_]+?.[a-zA-Z]{2,6}/)

Review: Garmin Nuvi 350

September 22nd, 2006

Garmin Nuvi 350 Pocket or Vehicle GPS Navigator with Integrated MP3 Player and Photo Viewer

I finally broke down and purchased the Garmin Nuvi 350 at BestBuy the other day. This consumer product is amazing, and well worth the money. Besides the iPod and Sony Wega LCD, the Garmin has to be best electronics buy in the past several years.

The Garmin Nuvi 350 is head and shoulders above its competition, compared to TomTom and Magellen. The others are bulky, and the power cords are the curly awkward ones that compare to the cords of an early 80’s telephone. The power cord on the Nuvi 350 Read the rest of this entry »

How to Get Ant Compiling in Eclipse

September 22nd, 2006

I recently came across a rather confusing issue with Ant not compiling in Eclipse, giving the following error:

[javac] BUILD FAILED: [build file location]
Unable to find a javac compiler;
com.sun.tools.javac.Main is not on the classpath.
Perhaps JAVA_HOME does not point to the JDK

I first made sure my Classpath was pointing to my jdk bin, which it was, then I made sure my java compiler (javac) was in the correct directory, which also was in right place.

Now I know Eclipse knows my jre and jdk installs, because it detects it on startup. The only issue that is left is whether or not Eclipse preferences are pointing Ant to the right .jar.

The solution I found, that has worked for me so far, is as follows:

  • Go to Window > Preferences > Ant > Runtime. Choose the Classpath tab. Select the Global Properties node in the tree and click Add External JARs. Select tools.jar from your JDK directory.
  • Go to Window > Preferences > Java > Installed JREs. Double click your JRE and deselect “Use default system libraries”. Click Add External JARs and add the location of tools.jar to that classpath. Make sure you are using the SDK and not the JRE.

Hope this helps.

JSON or XML

August 22nd, 2006

JSON is a human readable lightweight data-interchange format, and is based on JavaScript, hence the acronym, JavaScript Object Notation. JSON is totally language independent, but its syntax is loosely based on the C family of languages, so integration with languages such as C, C++, C#, and Java are fairly straightforward.
Read the rest of this entry »

Amazing 3D Flash Development

July 22nd, 2006

I have recently become fascinated with 3d in the Flash environment, not to experiment, just merely observing. This is due in part by an ex-colleague of mine, Todd Anderson, who has been experimenting with game development and 3d for quite some time now. So as a naturally curious person, I decide to venture out in the the wild world of the web and search out other game and 3d developers in the flash environment. This article is a dedication to one blog I recently came across, which has amazing articles on 3d and physics development in actionscript. I strongly urge you to check the blog out and bookmark it for future reference if you are at all slightly interested in this kind of stuff. Check out Michael Baczynski’s blog now!