Deskryptor

JavaScript UnitTesting with JSDev

2012-01-25T13:26:00.002+01:00

JSDev is shiny new project from Douglas Crockford.
With JSDev it is easy to write UnitTest within file that will be tested.

JSDev uses comments and command line scripts to uncomment your test code and run tests.
This is in my opinion interesting and easy. Only disadvantage is coding within comments (or comment test code when it's ready). But if editors will understand this comment it would be really powerful.

With Node.js it will be easy to execute JS without browser.

Watch screencast at NetTuts+ to see it in action:
http://net.tutsplus.com/tutorials/javascript-ajax/meet-crockfords-jsdev/

Description: https://plus.google.com/118095276221607585885/posts/CTZ7BNx7a8z
Repository: https://github.com/douglascrockford/JSDev

Better Do Not Use MP3 in HTML5 Games

2012-01-09T07:34:00.001+01:00

MP3 is a format with fee if game is above 5000 copies. So if game has 5000 views layers can interpret that as 5000 copies...

It can be tricky so better use MP4.

More at Scirca blog: http://www.scirra.com/blog/64/why-you-shouldnt-use-mp3-in-your-html5-games

HTML5 Game Devs Blog

2012-01-06T10:56:00.002+01:00

There is new awesome blog about HTML5 Games Development: http://www.html5gamedevs.com/

I'm really impressed with amount of great posts that are published.

CSS After IE6 Era

2012-01-05T10:33:00.000+01:00

Nice list of CSS selectors and properties that can be used after dropping IE6 support.

http://www.bennadel.com/blog/2306-What-CSS-Properties-Are-Supported-When-You-Drop-IE6-Support.htm

Can I Use

2012-01-05T08:45:00.001+01:00

http://www.caniuse.com/

Nice compatibility tables with browsers that supports that feature.

Eg. http://www.caniuse.com/#feat=svg-html5 - SVG support.

What Should Every Programmer Know About Web Development

2012-01-03T08:12:00.001+01:00

http://programmers.stackexchange.com/questions/46716/what-should-every-programmer-know-about-web-development

There is everything, from design to security and advise to use MVC.

Chrome - Install Extension From Your Website

2011-12-29T10:48:00.000+01:00

This can be really helpful to promote your chrome extension.

http://code.google.com/chrome/webstore/docs/inline_installation.html

With this API it can be easy to ask users to install extension without browser sniffing and content script just to disable promotional popup on site when extension in already installed.

PHPUnit from sources in WAMPServer and NetBeans

2011-12-27T15:06:00.000+01:00

Tutorial how to install PHPUnit in WAMPServer on Windows and how to make it working in NetBeans 7.1

Disclaimer: If You can use PEAR it would be much easier! :)

1: Install WAMPServer: http://www.wampserver.com/

2: Checkout repositories mentioned at the bottom of page: https://github.com/sebastianbergmann/phpunit

I created folder "includes" in PHP directory.

mkdir phpunit && cd phpunit
git clone git://github.com/sebastianbergmann/phpunit.git
git clone git://github.com/sebastianbergmann/dbunit.git
git clone git://github.com/sebastianbergmann/php-file-iterator.git
git clone git://github.com/sebastianbergmann/php-text-template.git
git clone git://github.com/sebastianbergmann/php-code-coverage.git
git clone git://github.com/sebastianbergmann/php-token-stream.git
git clone git://github.com/sebastianbergmann/php-timer.git
git clone git://github.com/sebastianbergmann/phpunit-mock-objects.git
git clone git://github.com/sebastianbergmann/phpunit-selenium.git
git clone git://github.com/sebastianbergmann/phpunit-story.git
git clone git://github.com/sebastianbergmann/php-invoker.git

I also check out branches (mostly 1.1) of this repositories.

Add all of this directories to php include_path (note that WAMP has two php.ini files, one in PHP directory, and one in APACHE, this in php directory is obligatory.

For me it looks:
include_path = ".;C:\wamp\bin\php\php5.3.8\includes\phpunit;C:\wamp\bin\php\php5.3.8\includes\php-file-iterator;C:\wamp\bin\php\php5.3.8\includes\php-code-coverage;C:\wamp\bin\php\php5.3.8\includes\php-token-stream;C:\wamp\bin\php\php5.3.8\includes\php-text-template;C:\wamp\bin\php\php5.3.8\includes\php-timer;C:\wamp\bin\php\php5.3.8\includes\phpunit-mock-objects"

Make it work in NetBeans

NetBeans usess phpunit.bat to get version (but without pear there is no version...)

First fix phpunit.bat to have proper php paths (I doesn't have PHP in PATH so this might be optional)

if "%PHPBIN%" == "" set PHPBIN="C:\wamp\bin\php\php5.3.8\php.exe"
if not exist "%PHPBIN%" if "%PHP_PEAR_PHP_BIN%" neq "" goto USE_PEAR_PATH
GOTO RUN
:USE_PEAR_PATH
set PHPBIN=%PHP_PEAR_PHP_BIN%
:RUN
"%PHPBIN%" "C:\wamp\bin\php\php5.3.8\inludes\phpunit\phpunit.php" %*

Thanks to this phpunit is for me properly executed.

Second: edit PHPUnit/Runner/Version file and just write your version.

class PHPUnit_Runner_Version

{

/**

     * Returns the current version of PHPUnit.

*

     * @return string

*/

    public static function id()

{

        return '3.6.0';

}

/**

     * @return string

*/

    public static function getVersionString()

{

        return 'PHPUnit 3.6.0 by Sebastian Bergmann.';

}

}

Test
To test I created Class in Test folder (just create folder "tests" in project and in project properties select it as "Test folder")

<?php
class DummyTest extends PHPUnit_Framework_TestCase
{
public function testToString()
{

$this->assertEquals('MyString', 'MyString');
}
}

JavaScript Modules

2011-12-23T11:41:00.000+01:00

Thanks to Vjeux I found nice one liner to set module for WebWorkers, Browser and Node.js. This really can be useful, and is short :)

http://blog.vjeux.com/2011/javascript/javascript-one-line-global-export.html

I think only how would it be hard to make it usable also for AMD.

Mugeda - Canvas Animations Creator

2011-12-17T14:27:00.000+01:00

This looks, and for me work similar to Flash editor.

https://www.mugeda.com/client/preview.html?id=1431

Canvas really has bright future :)

Chrome Extensions Manager

2011-12-15T18:23:00.001+01:00

Awesome Extension for all of the people that have too many extensions, and mix of them from both home and work.

https://chrome.google.com/webstore/detail/aalnjolghjkkogicompabhhbbkljnlka

With this extension I can easily choose which extensions should run at home, and which at work.

JavaScript - Performance and Style.

2011-12-05T11:25:00.000+01:00

MDN Holiday Calendar: http://thewebrocks.com/calendar/
Read every of 24 articles before Holidays! Very nice idea to get used to read something new every day!

Edit: I realized that last post was from another calendar!
Performance Calendar: http://calendar.perfplanet.com/2011/

Efficient JavaScript: http://dev.opera.com/articles/view/efficient-javascript/
Just like in title, big bunch of good practices and advises how to make JavaScript fast.

Idiomatic JavaScript: https://github.com/rwldrn/idiomatic.js
How to write beautiful JavaScript with suggestion about writing with others. Really recommended reading.

Annotated ECMAScript 5.1: http://es5.github.com/
Based on ECMAScript Language specification but with hyperlinks and annotations. This should be more friendly than original PDF.

Local Storage read performance: http://calendar.perfplanet.com/2011/localstorage-read-performance/
Local storage is much slower than what I would expect.

text-overflow: ellipsis for easy "..."

2011-12-05T09:45:00.001+01:00

As described on http://www.quirksmode.org/css/textoverflow.html

Can be used to create "..." for too long texts within blocks with overflow:hidden.

This can be really useful tool.

Mobile Performance

2011-12-05T08:40:00.001+01:00

Mobile Performance Manifesto: http://davidbcalhoun.com/2011/mobile-performance-manifesto
Everything You should know to make mobile fast.

Hardware accelerated graphics on Android: https://plus.google.com/105051985738280261832/posts/2FXDCz8x93s
Some facts about speed and hardware accelerated graphics.

innerWidth, InstaCSS, zepto.js, Binary Data

2011-12-02T06:51:00.001+01:00

To post less I include more links, but still has problem with title :)

innerWidth of mobile devices: https://gist.github.com/1410787

Typed Arrays in JavaScript: http://blogs.msdn.com/b/ie/archive/2011/12/01/working-with-binary-data-using-typed-arrays.aspx
This is longest post about binary data that I've seen.

Awesome HTML, JavaScript and CSS documentation: http://instacss.com/
This site is really impressive! I've just added it to bookmarks.

Zepto.js is a small library mostly for mobile devices with jQuery compatible syntax. New version came with Opera and Firefox support. http://zeptojs.com/

Design for Developers

2011-11-28T09:23:00.001+01:00

For me it is impressive and really informative to read about design. This presentation really is easy and helpful to me. Clear and easy rules how to design, how to use white space and how much of it.

Really recommend!

Design for developers

View more presentations from Johan Ronsse

jQuery Deconstructed

2011-11-27T22:50:00.001+01:00

http://www.keyframesandcode.com/resources/javascript/deconstructed/jquery/

This really helps with viewing sources of library.
Source is commented and showed in blocks. Really impressive.

Linux Mint 12

2011-11-27T12:50:00.001+01:00

Yesterday I installed new Linux Mint with Gnome 3 user interface and Mint extensions.
For now it really feels like Gnome 2 UI. There are differences of course, but they really make Gnome Shell more friendly!

I have some problems, one of them is still not fixed, I even don't know how to search for a fix.

After creation of USB drive i have error after boot:
"vesamenu.c32: not a COM32R image"

1: hit TAB button
2: type "Live" in console

Then I find impossible to install Chrome in Linux Mint 12:

1: Install Chromium
2: Install Chrome

It looks like new Mint doesn't have something important that Chrome needs, fortunately Chromium installs it, and this is enough for me to now that now it just works :)

Last problem is probably caused by video drivers. I use two monitors, on Laptop and second attached to VGA port.
This is strange but after blocking screen I have problem with the screen in Laptop. It fills with gray noise and is unusable :/

It happened only two times, I try to restart Shell.

Ctrl+r, and then r should restart gnome-shell interface.

WebGL Playground & e-commerce

2011-11-25T17:18:00.001+01:00

Lately I think more and more about WebGL. It looks like this technology gained enough momentum to really make change in how web works!

First I recommend read about WebGL i e-commerce.
http://www.ultranoir.com/en/#!/blog/trends/webgl_and_e-commerce/

This post in my opinion is true. Additionally I start to think what if shop website really is made in WebGL and looks exactly the same as "real" shop, where I could "walk" and get familiar with the shop...
Something like augment reality but in browser and on shop website. If someone write that site, this really could change rules on how websites are made today.

So if you want to try WebGL there is nice website jsfiddle-like for WebGL that you can use to play with WebGL and get more familiar with it.

http://webglplayground.net/

There are paypal donations so feel free to help the authors (I don't know them :).

Cryptography in JavaScript

2011-11-22T19:16:00.001+01:00

New library from Stanford promises to be a fast and secure library for cryptography in JavaScript.

http://bitwiseshiftleft.github.com/sjcl/

SJCL is easy to use: simply run

sjcl.encrypt("password", "data")

to encrypt data, or

sjcl.decrypt("password", "encrypted-data")

to decrypt it.

How To Learn Programming

2011-11-22T08:36:00.001+01:00

This is just only way to become programmer!

http://programming-motherfucker.com/become.html

Just pick one book and learn!

Writing forward-compatible websites

2011-11-21T14:43:00.001+01:00

Really recommended read for every Web Developer.

https://developer.mozilla.org/Writing_Forward_Compatible_Websites

DTrace in Node.js

2011-11-18T15:03:00.001+01:00

Presentation from Joyent. Explains debugging, and how it is done i Node.js
http://dtrace.org/resources/bmc/QCon.pdf

WebP

2011-11-18T13:41:00.001+01:00

WebP has many new features. Now it is more like gif and png.
Some new features:

animations
transparency
lossless mode

Read more at Google blog: http://blog.chromium.org/2011/11/lossless-and-transparency-encoding-in.html

About WebP: http://code.google.com/speed/webp/

JS Performance

2011-11-17T11:46:00.001+01:00

How DRY impacts JavaScript performance // Faster JavaScript execution for the lazy developer presentation by: Mathias Bynens

http://speakerdeck.com/u/mathiasbynens/p/faster-javascript-execution-for-the-lazy-developer

In my opinion most important is to write maintainable code and optimize only what needs to be optimized.
http://speakerdeck.com/u/mathiasbynens/p/faster-javascript-execution-for-the-lazy-developer?slide=49