JavaScript Dom

Open-source JavaScript projects categorized as Dom

Top 23 JavaScript Dom Projects

  • Preact

    ⚛️ Fast 3kB React alternative with the same modern API. Components & Virtual DOM.

    Project mention: I redesigned and open-sourced my SC2 search engine! Now featuring interactive filtering, fuzzy matching and search categories | reddit.com/r/starcraft | 2023-01-16

    Frontend: Astro with React/Preact

  • marko

    A declarative, HTML-based language that makes building web apps fun

    Project mention: Marko: An HTML-Based Language | reddit.com/r/patient_hackernews | 2023-01-31
  • Appwrite

    Appwrite - The Open Source Firebase alternative introduces iOS support . Appwrite is an open source backend server that helps you build native iOS applications much faster with realtime APIs for authentication, databases, files storage, cloud functions and much more!

  • DOMPurify

    DOMPurify - a DOM-only, super-fast, uber-tolerant XSS sanitizer for HTML, MathML and SVG. DOMPurify works with a secure default, but offers a lot of configurability and hooks. Demo:

    Project mention: 3 Quick Tips for Input Validation | dev.to | 2023-01-22

    It's also important to sanitize user input to prevent the injection of malicious code. There are several libraries that can help you with this such as xss-clean, dompurify or santize-html.

  • dom-to-image

    Generates an image from a DOM node using HTML5 canvas

    Project mention: Exporting html dom elements as png in javascript | dev.to | 2022-07-01
  • Choo

    :steam_locomotive::train: - sturdy 4kb frontend framework

    Project mention: Discovered a 63kb tiddlywiki like self saving HTML+JS wiki and its looking cool | news.ycombinator.com | 2022-05-22

    I'm currently working on a way to extend the code by revealing the underlying [Choo](https://choo.io) framework to enable easier hacking! Search is one feature that theoretically won't be too hard to add, but I excluded it from the core because it would have made it too big.

    Note: I have no solid reference point for what "too big" actually means for this project—my only guideline so far has been "as small as possible"

  • cash

    An absurdly small jQuery alternative for modern browsers. (by fabiospampinato)

    Project mention: Migrate jQuery to VanillaJS - UpgradeJS.com | reddit.com/r/javascript | 2023-01-27

    If stock jQuery seems too big and you have a lot of code you'd prefer not to waste time converting, try something like jQuery-slim or cash.

  • imba

    🐤 The friendly full-stack language

    Project mention: Why do so many CS grads seem to look down on webdev? | reddit.com/r/webdev | 2023-01-10

    At the same time, my heart is kind of in the web stuff and I find it a lot more exciting personally so it's hard for me to leave. You can do so much more with web tech and all the new ideas Tcoming from it and the pace it's developing is really . I just don't understand why React is becoming the standard when it's a complete nightmare compared to where we should be. I mean, this is literally insane, especially when things like Svelte exist - or even better, Imba. The day Imba becomes the standard is the day I love web dev again.

  • Sonar

    Write Clean JavaScript Code. Always.. Sonar helps you commit clean code every time. With over 300 unique rules to find JavaScript bugs, code smells & vulnerabilities, Sonar finds the issues while you focus on the work.

  • jest-dom

    :owl: Custom jest matchers to test the state of the DOM

    Project mention: Is there a jest query method for this use case? | reddit.com/r/reactjs | 2022-12-30

    React Testing Library uses jest-dom which has a .getByText() matcher.

  • goober

    🥜 goober, a less than 1KB 🎉 css-in-js alternative with a familiar API

    Project mention: A new paradigm | dev.to | 2022-02-20

    Then, there's goober, a minimalistic framework-agnostic css-in-js component library. You'll probably find more examples of modern yet frugal tools and libraries.

  • canjs

    Build CRUD apps in fewer lines of code.

  • holmes

    Fast and easy searching inside a page (by Haroenv)

  • nipplejs

    :video_game: A virtual joystick for touch capable interfaces.

    Project mention: Zoom SDK Powered Claw Machine | dev.to | 2022-11-17

    1 - Start Game / Catch Toy button 2 - Virtual Joystick / Control (nippleJS https://github.com/yoannmoinet/nipplejs) 3 - Game Timer (Animated Countdown Timer https://css-tricks.com/how-to-create-an-animated-countdown-timer-with-html-css-and-javascript/)

  • html-react-parser

    :memo: HTML to React parser.

    Project mention: Displaying WYSIWYG editor's output with React | reddit.com/r/webdev | 2022-07-06

    I'm glad I could help! Please be careful though and check the FAQ section of the library. It says that it does not sanitize and it's not XSS safe. This is the issue where they explain: https://github.com/remarkablemark/html-react-parser/issues/94

  • curtainsjs

    curtains.js is a lightweight vanilla WebGL javascript library that turns HTML DOM elements into interactive textured planes.

    Project mention: How to recreate this animated background with distortion effect? | reddit.com/r/webdev | 2022-04-24

    If you're purely wanting to add a shader effect then as a newcomer to the shader world I'd recommend curtainsjs as an easy way to add custom shaders without the hassle of having to deal with low level WebGL setup stuff. They even have a similar example with the mouse distortion effect where the code is much more readable and well commented with another codepen by the creator of curtains which has a more similar mouse flow effect that could be repurposed to be a post effect shader and distort the output of a gradient shader.

  • element-resize-detector

    Optimized cross-browser resize listener for elements.

  • replace-jquery

    Automatically finds jQuery methods from existing projects and generates vanilla js alternatives.

  • hyperx

    🏷 - tagged template string virtual dom builder

  • arrive

    Watch for DOM elements creation and removal

  • nanohtml

    :dragon: HTML template strings for the Browser with support for Server Side Rendering in Node.

    Project mention: $$maintainable.code() | reddit.com/r/ProgrammerHumor | 2022-12-31

    Or use a templater like nanohtml that lets you pass callbacks into the literals

  • motus

    Animation library that mimics CSS keyframes when scrolling.

  • snuggsi

    snuggsi ツ - Easy Custom Elements in ~1kB

  • react-tilt

    👓 Parallax tilt hover effect for React JS - tilt.js

  • long-press-event

    Adds `long-press` event to the DOM in 1k of pure JavaScript

  • InfluxDB

    Build time-series-based applications quickly and at scale.. InfluxDB is the Time Series Platform where developers build real-time applications for analytics, IoT and cloud-native services. Easy to start, it is available in the cloud or on-premises.

NOTE: The open source projects on this list are ordered by number of github stars. The number of mentions indicates repo mentiontions in the last 12 Months or since we started tracking (Dec 2020). The latest post mention was on 2023-01-31.

JavaScript Dom related posts

Index

What are some of the best open-source Dom projects in JavaScript? This list will help you:

Project Stars
1 Preact 33,735
2 marko 12,322
3 DOMPurify 10,338
4 dom-to-image 9,162
5 Choo 6,724
6 cash 6,068
7 imba 5,926
8 jest-dom 3,755
9 goober 2,812
10 canjs 1,897
11 holmes 1,696
12 nipplejs 1,578
13 html-react-parser 1,559
14 curtainsjs 1,399
15 element-resize-detector 1,264
16 replace-jquery 1,140
17 hyperx 995
18 arrive 824
19 nanohtml 675
20 motus 587
21 snuggsi 369
22 react-tilt 341
23 long-press-event 264
Build time-series-based applications quickly and at scale.
InfluxDB is the Time Series Platform where developers build real-time applications for analytics, IoT and cloud-native services. Easy to start, it is available in the cloud or on-premises.
www.influxdata.com