---
title: Pipedrive Praha, 10 November ’21 | {𝐅}rontendisti
tags: frontendisti
---

{%hackmd KXd2iUBpSjq7Ib2Z4h3LMg %}

# { 𝐅 } <br> Newwws<br>

10 November ’21

---

### Browsers

note:

- nothing revolutionary in current versions, but I am looking forward to see the new feature coming in Chrome 97

---

#### Chrome 97

[Recording user flows](https://developer.chrome.com/docs/devtools/recorder/)

note:

- you can test in Canary soon, after 96 is released next week
- part of Chrome 97 devTools
- you will be able to record, replay and measure user flows, great help for on site testing under preset condition (throttling etc.)
- it looks promising, but I haven’t got chance to test it yet

---

## Caught in the net

---

[Use CSS Variables instead of React Context](https://epicreact.dev/css-variables/) for theming

note:

- Kent C. Dodds presents the power of using CSS Custom properties while still being a fan of CSS-in-JS approach.

---

[CSS resize: diagonal](https://twitter.com/jh3yy/status/1456728953687875584?t=sJ4d7___LtzefmZ1WscjZg&s=19)

.resize { 
  resize: horizontal;
}

.resize__content {
  aspect-ratio: 1 / 1;
  width: 100%;
}

<a href="https://codepen.io/jh3y/pen/BadrNBX">
CSS resize: diagonal</a>

note:

- nice little trick to bring in the missing behaviour

---

[CSS dynamic viewport units](https://twitter.com/bdc/status/1455888984849145857?t=VYIOVfmwawPXwyFD-3E4Xg&s=03) were already implemented in @webkit

body { 
  height: 100dvh 
}

note:

- The Dynamic Viewport is the viewport sized with *dynamic consideration of any UA interfaces*. It will automatically adjust itself in response to UA interface elements being shown or not.
- That means all the viewport hacks and workarounds for the notches on iOS are coming to an end.

---

### 3× UX articles

- [Designing a complex table for mobile consumption](https://uxdesign.cc/designing-a-complex-table-for-mobile-consumption-nom-7472f7b11fe6)
- [10 misconceptions on UX](https://10ideesrecuesenuxdesign.castoretpollux.com/en/)
- [Laws of UX](https://lawsofux.com/)

note:

- Designing complex table is an UX case study presenting the design process behing redesiging huge and complex tables for mobiles.
- A fun tour through misconceptions on UX, enjoy it.
- A collection of UX best practices for building user interfaces.

---

Thanks, slides soon on [@frontendisti](https://twitter.com/frontendisti)