DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 968,873 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Cover image for Web workers cheatsheet & 4 other webdev tips you may want to know πŸš€
Mustapha Aouas
Mustapha Aouas

Posted on • Updated on

Web workers cheatsheet & 4 other webdev tips you may want to know πŸš€

1. Web workers cheatsheet

A worker thread can perform tasks without interfering with the user interface. This can be handy if you want to perform a CPU heavy operation for example:

Web workers cheatsheet

Β 

2. Manipulating placeholders with CSS

πŸ“How to style a placeholder? Use the ::placeholder pseudo element

πŸ“How to target an input with a visible placeholder? Use the :placeholder pseudo class

Manipulating placeholders with CSS

Β 

3. Make your headers look better

You can use the text-rendering CSS property to provides information to the rendering engine about what to optimize for when rendering text:

Make your headers look better

Β 


Hi there! I'm Mustapha, a technical writer, speaker and a passionate JS / TS developer. Follow me on Twitter for daily tech tips πŸš€


Β 

4. Sass mixins cheatsheet

You can use Mixins to define styles that can be re-used throughout your stylesheets:

Sass mixins

Β 

5. Text alignement with HTML

You can use <sup> HTML element to display a superscripts: a raised baseline using smaller text, and <sub> to render a subscripts: a lowered baseline and smaller text:

Text alignement with HTML

You can achieve the same behaviour with the vertical-align CSS property. More on this below:

Β 
Β 

Let's connect

That's it for this week. I hope you liked it. If you did, please share it with your friends & colleagues and follow me on Twitter @theAngularGuy where I tweet about web development and computer science πŸš€

Cheers!

Top comments (6)

Collapse
 
jaykobo profile image
Jakob Strauß

Great content series and I really love the style of your images. On point!

Collapse
 
mustapha profile image
Mustapha Aouas Author

Thank you Jacob! πŸ™

Collapse
 
dhruvjoshi9 profile image
Dhruv Joshi

Super amazing content man!!

Collapse
 
mustapha profile image
Mustapha Aouas Author

Thank you πŸ€œπŸ€›

Collapse
 
gamerseo profile image
Gamerseo

Good tips. But when designing your website, you should always remember about the appropriate page speed. This is one of the most important aspects of SEO.

Collapse
 
mustapha profile image
Mustapha Aouas Author

I guess you are referring to the β€˜ text-renderingΒ΄ property. It’s not something one should use on every element that’s for sure. That’s why I targeted only headers on the snippet, but maybe I should add a note or a warning about this.

🀯

"I made 10x faster JSON.stringify() functions, even type safe"

☝️ Must read for JS devs