Reduce CSS bundle size by cutting class names

This is pure awesomeness! Gajus Kuizinas went beyond asset minifiers which resulted from 140KB to 53KB CSS size decrease. There is one thing a minifier cannot do – change the selector names. This is because a CSS minifier does not control the HTML output. Meanwhile, CSS names can get long. All the details are in the post worth reading, if still think that webpack can only merge JS files in a bundle....

September 5, 2017 · 1 min · anvyst

JSData as ember-data alternative

Weekends are normally for RnD time, so this weekend’s topic - standardisation of front/backend communication. Considering backend as API-only and fully offloading the rendering part to JavaScript frameworks, EmberJS had a really nice concept of ember-data that acted in between rendering components and backend objects received via API. JSData can be an alternative to this: SData is a framework-agnostic, datastore-agnostic ORM (Object-Relational Mapper) for Node.js and the Browser. Adapters allow JSData to connect to various data sources such as Firebase, MySql, MongoDB, REST API, etc....

September 3, 2017 · 1 min · anvyst

CakePHP with NightwatchJS on Travis CI

After the release of Headless Chrome browser (v59+) most of the automation tools slowly started reducing the usage of Selenium, by replacing it with the combination of chromedriver + chrome/chromium pre-installed browser (like Travis CI does on their images). As a replacement, I’ve tried playing around with the combination of Karma/Chai to test JavaScript functionality of certain projects we have in Qobo. It only introduced the unit test approach towards the code base....

August 31, 2017 · 3 min · anvyst

ReactJS: BSD + Patents licensing model

The devil is in details, so people say. Few months ago, while working on prototype of cakephp-calendar, we had an interesting debate over front-end stack for Calendar component. At the same time, WordPress community was buzzing about their text editor - Gutenberg whether to use ReactJS vs VueJS libraries. One of the reasons of choosing VueJS, was licensing agreement. The license granted hereunder will terminate, automatically and without notice, if you (or any of your subsidiaries, corporate affiliates or agents) initiate directly or indirectly, or take a direct financial interest in, any Patent Assertion....

August 23, 2017 · 1 min · anvyst

VueJS watchers for MomentJS

It took me some time to figure out what’s been going wrong with the watchers working on datepicker integration for CakePHP-Calendar plugin. Problem domain On loading modal window for creating calendar event, one of the dropdowns pass default start/end time for the event interval (start/end dates). This config object is passed to as a property into interval component that contains two child datepicker components. Whenever the config property changes, it adjusts startMoment and endMoment objects and passes them into datepickers....

August 2, 2017 · 2 min · anvyst

ES2015: Refresher on modern JavaScript

A quick lookup on modern JavaScript and whole Babel thing. This will be a start of a small research on splitting frontend and backend implementation for CakePHP framework and its plugin. Babel JS: ES2015 ES6: Features Webpack - Confusing Parts Babel JS: Loaders & Plugins Jest for Webpack * “Getting started with Babel” from John Arstingstall CakePHP and Webpack plugin

June 22, 2017 · 1 min · anvyst

JavaScript - technological singularity & younglings effect

On March 2017, Eugene Gusev had an interesting talk (in Russian) at HolyJS regarding the technological singularity as whole in Front-End, and JavaScript ecosystem in particular. As a thesis taken, he noted an enormous number of 350k packages in NPM. Few points being stated over the talk: Quality of the packages (aka younglings publish low quality tools) Hype over the ecosystem (frameworks and libs go up and down in popularity scale)....

June 15, 2017 · 4 min · anvyst

Yarn: package manager for JS modules

Yarn kitty rocks! Yarn is a package manager for your code. It allows you to use and share code with other developers from around the world. Yarn does this quickly, securely, and reliably so you don’t ever have to worry. Yarn allows you to use other developers’ solutions to different problems, making it easier for you to develop your software. If you have problems, you can report issues or contribute back, and when the problem is fixed, you can use Yarn to keep it all up to date....

November 12, 2016 · 1 min · anvyst

JavaScript function call vs arrow functions

Greate quote from Agile Software Craftmanship describing some of the short-cuts in programming languages. Classical example - function call versus arrow functions. “…the ratio of time spent reading versus writing is well over 10 to 1. We are constantly reading old code as part of the effort to write new code.Because this ratio is so high, we want the reading of code to be easy even if it makes the writing harder....

August 24, 2016 · 1 min · anvyst

EmberJS: JCF with components

JavaScript Custom Form elements is a useful jQuery plugin for customising your form elements, in case you have to get away from the default styling of the form elements. However, there’s a tiny “but” with the plugin when you use it with EmberJS. JCF initially designed to be used on the global scope, and in some case (like mine), it’s not what you need. If you’re using custom select-element with JCF without JCF....

August 22, 2016 · 2 min · anvyst