About Mergely JavaScript library

Diff and merge

Mergely is a powerful online diff and merge editor and javascript library that highlights changes in text. It can be embedded within your own Web application to compare files, text, C, C++, Java, HTML, XML, CSS, and javascript. Refer to the documentation for information on how to use Mergely. Also, please refer to the the license agreement.

  • Browser-based differencing tool
  • Diff or Merge changes in your own web applications
  • Always available
  • Free (LGPL, GPLv3)
  • Commercial license available
  • Share diffs online for demonstration or discussion
  • Simple to use

Mergely is written with the aid of Code Mirror JavaScript library, and uses HTML5 canvas to markup the differences between documents. It will work in most modern browsers.

Supported browsers

The Mergely library uses elements of HTML5, so you need an HTML5 compatible browser. The following browsers are supported:

  • Firefox
  • Chrome
  • Edge
  • Safari

Documentation

The Mergely reference manual is a good place to start to learn how to integrate Mergely into your web application.

Support

The Mergely's github repository is the best place to raise issues Star the repo if you like Mergely. Also, while you are there, it would be a good idea to watch the repository for changes. Features and patches are generally not announced.

Announcements

Any special announcements will be made on Twitter https://twitter.com/jamiepeabody.

How to use

If you are already familiar with diff, then you are already familiar with Mergely. Given two documents, Mergely will attempt to find changes that occured from the first one to produce the second one. When using Mergely, the left-hand side editor is the "original" document. The right-hand side is the "new" document. For an example, see the United States Declaration of Independence, first draft written by Thomas Jefferson, and then published.

You only upload documents to your browser - differencing is done within the browser itself. Your documents will only be copied to the server if you 'Share' the document. Markup operates from left to right so that if a word is removed from the left, it is crossed out, but if a word is added to the right-hand side, it is shown as being added in.

On the far left-hand and right-hand sides, there are small margins that identify changes within the whole document, one for each document. The whole document cannot be viewed at once, so the left and right margins allow you to quickly scroll to the change by clicking in the margin.

In the middle-margin, the changes are joined by start and end bars to indicate where blocks of text have changed from the original document and where the changes now occur in the new document. Lines help guide you to the changes in the new document.

Privacy

Your documents never leave your browser. They are not permanent unless you save them. Saving documents creates a permanent document that can be shared in emails or blogs. Anyone with the link can access the documents. We do not collect or share any personal information about you.

Contributing

You can fork Mergely on github: https://github.com/wickedest/Mergely

git clone https://github.com/wickedest/Mergely

Roadmap

  • Pure browser-based diff (no server)
  • File download
  • Multiple file upload
  • Line wrapping
  • Drag and drop file upload
  • SSL
  • Hide unchanged lines
  • Speed improvements
  • Font and style settings
  • Embedded
  • Ignore white space
  • Ignore case
  • Ignore accent characters
  • React component static view
  • 3-way merge

If there is anything missing from the roadmap please feel free to contact Jamie Peabody.