I think the navigator APIs like deviceMemory are really worth understanding and making use of in a lot of cases. Whether checking on device capacity or network bandwidth preferences, tailoring the experience to the visitor is a great idea.
Hello, World! I'm jzombie, a passionate software developer with a knack for problem-solving and a love for open-source. I believe in the power of code to change the world and make our lives easier.
Hello, World! I'm jzombie, a passionate software developer with a knack for problem-solving and a love for open-source. I believe in the power of code to change the world and make our lives easier.
Hello, World! I'm jzombie, a passionate software developer with a knack for problem-solving and a love for open-source. I believe in the power of code to change the world and make our lives easier.
Hello, World! I'm jzombie, a passionate software developer with a knack for problem-solving and a love for open-source. I believe in the power of code to change the world and make our lives easier.
Graduated in Digital Media M.Sc. now developing the next generation of educational software. Since a while I develop full stack in Javascript using Meteor. Love fitness and Muay Thai after work.
Thanks for the article!
Some reasons are valid however other ones are outdated (browser support, for example). It is not a replacement. It is something with basic functionality that reseems the behiavor of the accordion. And not using a javascript library to achieve something simple for me is a big win.
I'd think that Web Components should be super popular right now, but right now only 5% to 8% of websites use it. That's slightly sad, I think. It's an amazing feature that should be emphasized, built right into the browser.
Online since 1990 Yes! I started with Gopher. I do modern Web Component Development with technologies supported by **all** WHATWG partners (Apple, Google, Microsoft & Mozilla)
There are Browser Vendor and Userland Web Components.
The metrics do not count input, video and many other tags. Those are all built, by browser vendors, with Web Component technology. If you open YouTube, your are using Web Components.
I'm not sure what you're trying to say here. Using Web Component technology doesn't mean you're using web components, and I'm certain most people wouldn't classify input and video tags as web components, albeit even if they're built with its technologies. The Web Components I'm emphasizing here isn't the technology or whatever, but rather the API as we all know it. Nice looking custom markup tags and a controller class with customElements.define magic. Also, in this post we're talking about underrated browser features as thought by web developers, not by random people that visit Youtube that's built on Polymer or whatever.
Nice question, I recently though about what would be my favorite browser API, because there are so many of them, and basically you get them for free (if support is available across the major browser vendors..)
For example, I saw an implementation of a custom parser for URL params.. written long time ago. And I thought. May the browser support of URLSearchParams wasn't that great at that time..(?)
But if we're looking for most unterrated browser APIs, the performance API comes to my mind first. Or the FormData interface which I recently used in a side-project. FormData makes it really easy to obtain data from a <form> without dealing with controlled components (in React) or whatever 😄
Yes, when people talk about form in React, they often make every field in the form become controlled component, which is not good for the performance. FormData is the powerful feature that allows working with form easily in an effective way.
Oh, and if you are using it in React, you'd likely pass a ref to the FormData constructor - like new FormData(formElRef) instead of getting the element with document.getElementById
Hello, World! I'm jzombie, a passionate software developer with a knack for problem-solving and a love for open-source. I believe in the power of code to change the world and make our lives easier.
Online since 1990 Yes! I started with Gopher. I do modern Web Component Development with technologies supported by **all** WHATWG partners (Apple, Google, Microsoft & Mozilla)
Hello, World! I'm jzombie, a passionate software developer with a knack for problem-solving and a love for open-source. I believe in the power of code to change the world and make our lives easier.
So, this project actually uses a "virtual server" (peer in the middle) which proxies streams to all other participants. Maybe it's a bad idea, but here you go: speaker.app/
Hello, World! I'm jzombie, a passionate software developer with a knack for problem-solving and a love for open-source. I believe in the power of code to change the world and make our lives easier.
Hello, World! I'm jzombie, a passionate software developer with a knack for problem-solving and a love for open-source. I believe in the power of code to change the world and make our lives easier.
I love the fact that you can extend (or even override) some native browser APIs in order to do things such as spy on third party SDKs when they are opening WebSocket / Worker threads: reshell.org/native-spy-agent
Online since 1990 Yes! I started with Gopher. I do modern Web Component Development with technologies supported by **all** WHATWG partners (Apple, Google, Microsoft & Mozilla)
Hello, World! I'm jzombie, a passionate software developer with a knack for problem-solving and a love for open-source. I believe in the power of code to change the world and make our lives easier.
Intl
The Intl object is the namespace for the ECMAScript Internationalization API, which provides language sensitive string comparison, number formatting, and date and time formatting. The Intl object provides access to several constructors as well as functionality common to the internationalization constructors and other language sensitive functions.
Online since 1990 Yes! I started with Gopher. I do modern Web Component Development with technologies supported by **all** WHATWG partners (Apple, Google, Microsoft & Mozilla)
I think the navigator APIs like
deviceMemory
are really worth understanding and making use of in a lot of cases. Whether checking on device capacity or network bandwidth preferences, tailoring the experience to the visitor is a great idea.developer.mozilla.org/en-US/docs/W...
Interesting, I'll probably use that API in a program I'm developing: reshell.org/memory-info
What is this thing? Looks massive.
It's a UI that I'm making for a few projects which share some common base functionality, I'm creating under the monicker "Phantom architecture"...
github.com/zenOSmosis
OMG. This is fantastic
Thank you!
@camco. Here's another version of it w/ audio streaming support: speaker.app/
MutationObserver: Detect changes in DOM elements, the right way.
IntersectionObserver: detect elements entering the viewport or are close to entering.
Both relieve you of writing code, that has a high chance of being imperformant or bloated.
I'll add the ResizeObserver to that list.
Html offers a basic accordion just using
details
andsummary
html tags. More on mdn developer.mozilla.org/en-US/docs/W...The
<details>
-Tag is still not a replacement for an accordion.adrianroselli.com/2019/04/details-...
Thanks for the article!
Some reasons are valid however other ones are outdated (browser support, for example). It is not a replacement. It is something with basic functionality that reseems the behiavor of the accordion. And not using a javascript library to achieve something simple for me is a big win.
I'd think that Web Components should be super popular right now, but right now only 5% to 8% of websites use it. That's slightly sad, I think. It's an amazing feature that should be emphasized, built right into the browser.
There are Browser Vendor and Userland Web Components.
The metrics do not count
input
,video
and many other tags. Those are all built, by browser vendors, with Web Component technology. If you open YouTube, your are using Web Components.I'm not sure what you're trying to say here. Using Web Component technology doesn't mean you're using web components, and I'm certain most people wouldn't classify
input
andvideo
tags as web components, albeit even if they're built with its technologies. The Web Components I'm emphasizing here isn't the technology or whatever, but rather the API as we all know it. Nice looking custom markup tags and a controller class withcustomElements.define
magic. Also, in this post we're talking about underrated browser features as thought by web developers, not by random people that visit Youtube that's built on Polymer or whatever.Nice question, I recently though about what would be my favorite browser API, because there are so many of them, and basically you get them for free (if support is available across the major browser vendors..)
For example, I saw an implementation of a custom parser for URL params.. written long time ago. And I thought. May the browser support of
URLSearchParams
wasn't that great at that time..(?)But if we're looking for most unterrated browser APIs, the performance API comes to my mind first. Or the
FormData
interface which I recently used in a side-project.FormData
makes it really easy to obtain data from a<form>
without dealing with controlled components (in React) or whatever 😄Yes, when people talk about form in React, they often make every field in the form become controlled component, which is not good for the performance.
FormData
is the powerful feature that allows working with form easily in an effective way.can you point me to a good article about this: using FormData interface instead of dealing with controlled components, please
I've used MDN alot. For example this post
developer.mozilla.org/en-US/docs/W...
One thing I've learnt is to use
Object.fromEntries(formData.entries())
to get the values from the form. See the snippet for more detailsthanks
Oh, and if you are using it in React, you'd likely pass a ref to the FormData constructor - like
new FormData(formElRef)
instead of getting the element withdocument.getElementById
I think it's webrtc. It's used by all major communication and Real Time apps, but almost no one talks about it.
I'll second that.... WebRTC data channels and WebSockets are my thing.
Ask anyone using WebRTC if they even know about Server Sent Events and the EventSource API
I see so many projects using a bloated WebRTC server, because a developer didn't read the F* manual.
So, this project actually uses a "virtual server" (peer in the middle) which proxies streams to all other participants. Maybe it's a bad idea, but here you go: speaker.app/
I had no clue about these APIs. Thanks for sharing.
I mean just read the whole web API list, and I guarantee you will find something you never knew existed.
MDN Web API
This is a post that deserves the subscribe button! Can't wait to see what people say.
I wrote a post, on project that I currently working on.
It is using Chrome's APIs underneath.
Post -> Talk to people who are on the same site 🌎 | Chrome Extension
I love the fact that you can extend (or even override) some native browser APIs in order to do things such as spy on third party SDKs when they are opening WebSocket / Worker threads: reshell.org/native-spy-agent
SSE - Server Sent Events, and the EventSource API
I often use the Intl API, really cool API I think.
developer.mozilla.org/en-US/docs/W...
Intl
The Intl object is the namespace for the ECMAScript Internationalization API, which provides language sensitive string comparison, number formatting, and date and time formatting. The Intl object provides access to several constructors as well as functionality common to the internationalization constructors and other language sensitive functions.
Love that you used the Mosaic logo for this. Brings back memories.
Broadcastchannel is more powerfull then window.postmessage api
In regards to upcoming APIs, as in not yet fully supported, the Barcode Detection API is insane. developer.mozilla.org/en-US/docs/W...
XSLT transformation - good standardized way dynamically move logic from server side to client side
+1
May Microsoft SharePoint live forever!
And Ektron! srsly why dd we send so many angle brackets over the phone lines back then?