Top 7 TypeScript dom-manipulation Projects

dflex

129 1,727 8.4 TypeScript

The sophisticated Drag and Drop library you've been waiting for 🥳

Project mention: Introducing DFlex - A Modern Javascript Drag and Drop Library | dev.to | 2023-11-10

I'd love for you to check out the DFlex website to see examples and live demos. Let me know if you end up building something cool with DFlex! I'm always looking for feedback to help improve the library.

diff-dom-streaming

2 84 7.8 TypeScript

HTML Streaming Over the Wire! 🥳 Diff DOM algorithm with streaming to make only the necessary modifications, insertions and deletions between a DOM node and an HTML stream reader.

Project mention: SPA-Like Navigation Preserving Web Component State | dev.to | 2024-04-25

The View Transitions API provides a mechanism for easily creating animated transitions between different DOM states while also updating the DOM contents in a single step, and yes, they can be used during streaming, and divide it into different steps. To activate it, it is only necessary to pass the transition: true setting to Diff DOM Streaming library:

SurveyJS

surveyjs.io sponsored

Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.
asdom

1 79 0.0 TypeScript

Use DOM APIs in AssemblyScript
necktie

2 42 0.0 TypeScript

Necktie – a simple DOM binding tool
parse-html-stream

1 21 6.2 TypeScript

During the HTML streaming, capture the DOM Nodes to work with them

Project mention: HTML Streaming and DOM Diffing Algorithm | dev.to | 2024-02-21

To do this, the parse-html-stream library that I have recently put in open-source, supports also walking through the tree of nodes during streaming, allowing you to do incremental rendering, while you walk through the tree the library is parsing the HTML chunks in the order they arrive, and while you have the parsed nodes you are making the rendering changes.

weya

1 15 0.0 TypeScript

Simple Typescript/Javascript framework for DOM manipulation
htmx-serverless

1 14 6.4 TypeScript

HTMX Serverless XHR requests. A frontend tool to define custom responses to XHR requests based on the request Path.

Project mention: HTMX - Serverless extension | /r/htmx | 2023-10-18

I haven't used it much yet, but I quickly made an extension to bypass some of the XHR requests by defining a map of path-->response pairs, like so:

InfluxDB

www.influxdata.com sponsored

Power Real-Time Data Analytics at Scale. Get real-time insights from all types of time series data with InfluxDB. Ingest, query, and analyze billions of data points in real-time with unbounded cardinality.

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).