PORTFOLIO SHOWCASE: 3D LIVING ROOM IN CITY

PORTFOLIO SHOWCASE: 3D LIVING ROOM IN CITY

Another 3D widget I've been working on, that can be dropped into a flooring manufacturer's website to give potential buyers an idea of what their flooring looks like (this time in a living room). The widget currently runs in Chrome, Safari, Firefox, IE Edge. Mobile optimizations to come. TECHNOLOGIES Custom built 3D engine using Three.js and ES6 with real-time lighting, shadows and reflections (new) spherical skybox implemented in the engine 3D models optimized by hand and bundled using WebPack
- PORTFOLIO SHOWCASE: 3D LIVING ROOM IN CITY

Read more

Portfolio showcase: 3D widget for displaying floors

Portfolio showcase: 3D widget for displaying floors

Here's a 3D widget I've been working on, that can be dropped into a flooring manufacturer's website to give potential buyers an idea of what their flooring looks like. The widget currently runs in Chrome, Safari, Firefox, IE Edge. Mobile optimizations to come. Technologies Custom built 3D engine using Three.js and ES6 with real-time lighting, shadows and reflections 3D models optimized by hand and bundled using WebPack (article here) React wrapper for easy embedding in React projects Todo Real-time
- Portfolio showcase: 3D widget for displaying floors

Read more

Unit Tests 102: Isolating your code with Mocks and Stubs

One of the most important things to remember when testing code is to provide a consistent environment for tests to run in. This is done by isolating the code from the outside world which not only makes for consistent results, but also results in failures in one module not having adverse effects on tests of another. Isolating code can seem like a challenging task, especially in the fast changing world of JavaScript. Note: I use ES6 throughout this article; check
- Unit Tests 102: Isolating your code with Mocks and Stubs

Read more

We don't need your polyfills!

In the fast changing world of HTML5, we've grown accustomed to using polyfills to bring future and current features to all browsers. Browsers are starting to catch up and support these features natively, yet we continue to bundle code that may not be used. Find out how Webpack's chunking and code splitting can be used to only download polyfills when necessary. Update Jan 30th 2017: Webpack 2 final has deprecated System.import in favor of import() which complies with the
- We don't need your polyfills!

Read more

ES6 module chunking and deferred loading with Webpack 2

Webpack does a lot more than bundle source files into a distributable package. Its code splitting and dynamic loading capabilities make it a great tool for controlling the lifecycle of an application. This article shows a real-world example of code splitting and chunking to positively impact user experience. Update Jan 30th 2017: Webpack 2 final has deprecated System.import in favor of import() which complies with the spec. This article has been updated to the latest syntax. I was recently
- ES6 module chunking and deferred loading with Webpack 2

Read more

JavaScript is all grown up, or is it?

JavaScript is all grown up, or is it?

JavaScript has received its first major update since 2009. Find out what ES6 features will have the biggest impact on your codebase using real-world examples and get the tooling to get started in all 3 flavours: Gulp, Grunt and Webpack. ES6 stands for ECMAScript6, which is the latest version of language specification JavaScript is derived from. Back in December of 2015, I took the lead to re-write the 3D engine that powers our awesome Design Center application. We use ThreeJS
- JavaScript is all grown up, or is it?

Read more