You can use the `loading=lazy` attribute to defer the loading of the image until the user scrolls to them.
2. Email, call, and SMS links:
3. Ordered lists `start` attribute.
Use the `start` attribute to change the starting point for your ordered lists.
4. The `meter` element
You can use the `<meter>` element to display quantities. No JavaScript/CSS needed.
5. `window.opener`
Pages opened with `target="_blank"` allow the new page to access the originalβs `window.opener`. This can have security and performance implications. Include `rel="noopener"` or `rel="noreferrer"` to prevent this.
6. Base Element
If you want to open all links in the document in a new tab, you can use <base> element:
7. Favicon cache busting
To refresh your websiteβs favicon you can force browsers to download a new version by adding ?v=2 to the filename.
This is especially helpful in production to make sure the users get the new version.
8. Native HTML sliders
You can use `<input type="range">` to create sliders.
9. HTML Accordion
You can use the `details` element to create a native HTML accordion.
10. `mark` tag
You can use the `<mark>` tag to highlight text.
11. `download` attribute
You can use the `download` attribute in your links to download the file instead of navigating to it.
12. Performance tip
Use the `.webp` image format to make images smaller and boost the performance of your website.
If you liked this thread, maybe you'd love to bookmark it as a post.
Smooth scrolling with zero JavaScript, with just one line of CSS.
2. When you work with transparent images you can use the `drop-shadow()` filter function to create a shadow on the image's content, instead of `box-shadow` property which creates a rectangular shadow behind an element's entire box:
π flexjobs. com
π remote. co
π justremote. co
π weworkremotely. com
π remoteok. io
π jobspresso. co
π europeremotely. com
π wfh. io
π dailyremote. com
π angel. co
π jsremotely. com
π remoteleaf. com
π remoteleads. io
π hired. com
It looks like @gitlab has a lot of open positions.