Value precision

I've always wanted to indicate how precise the value is, particularly for QB. Sometimes in product specs there's only a vague value, like “weight around 3 lbs”. If I create attribute “value: 1.36” (QB uses SI units), it means exactly 1.36 kg, not around 1.36 kg.

Precision as a confidence interval could be as percent or absolute value, like it's “140 ± 5 %” (interval <133; 147>) or “140 ± 10” (interval <130; 150>).

One way, how to achieve this, is to add another attribute to the data particle, indicating how precise the value is – possibly as a deviation of some sort. I didn't wanted that, because it will be used only in infrequent cases, so the value would be almost always 0 and therefore wasted space in the DB, so to speak.

Another approach, albeit less specific, is to use the precision in definition of the whole data type. I used this for Qedy, where for datetime values you can define how precise the value should be – often "days" (for date) or "seconds" (for datetime) or even “15 minutes” (for, like, reservations).

The best solution, although far from optimal, would be a complex type (object), such as:

1. {
2. value: 250,
3. precision: 10,
4. validFrom: "1950-01-01",
5. validTo: "1951-01-01"
6. }

Now you can specify not only the value and it's precision, but also other metadata, e. g. interval of validity of the value, in case it changes over time, like population.

And it would open the door to much broader definitions, like omitting the value altogether – in cases the spread is known:

1. {
2. valueFrom: 1367,
3. valueTo: 1372
4. }

Styling components

…Adding styles in QedyJS v3

.style(...)

(+) Snadné na implementaci, snadné použití

(-) Vždy budou kombinované selektory .comp.style a bude jich HODNĚ.

.style(...) => o... + i...

(+) Snadné na implementaci, snadné použití

(+) Jedna sada stylů

(-) Matoucí, v CSS nebude existovat styl, který zadám do .style(xxx); vždy bude prefixovaný

.styleInner(...) + .styleOuter(...)

(+) Jasné, málo kdy budou styly stejné

(-) Příliš mnoho psaní, rád bych měl jen .style(...), aby to korespondovalo se specifikací komponenty

(-) Dvě sady stylů v definici komponenty

.style(..., true)

(+) Ideální varianta

(-) Druhý parametr již je boolean na "force" (ala classList.toggle)

(-) Dvě sady stylů v definici komponenty

Lighthouse

After the blog conquered PageSpeed Insights, it's time to do the same with Lighthouse.

It's conveniently embedded with Chromium-based browsers and the new Edge is no different. Simply open DevTools and go to “Audits” page, which may be hidden under the “»”. There select desired categories, maybe some community plugins, and pick a target device (mobile or desktop). Then click the “Generate report” button and wait.

It will refresh the page couple of times and after a few seconds it shows scores between 0 (worst) and 100 (best) for Performance, Accessibility, Best Practices, SEO and where applicable, Progressive Web App (PWA).

...and some of them are even not faked or anything ;-)

In every section it will tell you what passed and what failed, with description how to improve it. Sometimes it's may be impossible to score 100 simply due to webhosting limitations, if you e.g. can't define headers for static files.