How save text, svg, html, css all together efficiently

Question

In an application, I am using Fabric.js, which lets users write text, draw SVG's, insert images etc.
I want to know, what is the best way to store this data.

Requirements are:

1. Ability to query the data(text), which tells me that i should store it in DB (MySQL as of now)

2. I have images, and I am targeting IPad as well, so the images are important, as to how they are stored.

3. SVG's and HTML/CSS to be saved as well.

4. I also want to do versioning of the content, as Quora does it, so that a user can see the changes from the past version to the current version. This also includes the versioning of images and SVG's.

I am wondering how Google Docs does it, because they also store our documents, drawings etc.

What is the best way of doing this?

Answer 1

I manage a webapp where users generate reports, and found it more efficient to store images and binary files in the filesystem, and link to them from the database. Elements that are in xml or text are kept in the database for easier searching - in your case this would include css/html and svg (which is xml). Use the database for managing revisions.

Might also check out this thread on storing images in a database.

It looks like Frabic.js is using the node.js javascript webserver on the backend - haven't used this before, but you might investigate which databases are easiest to use with node.js:

• node.js database
• nodejs and database communication - how?
• nodejs where to start?

Answer 2

i dont known if it helps but, Opera browser offer an option to save the webpages to an unique file { mht extension }, this stores all the files { css, images, scripts, etc } in base64 encoded text for a later use { when the document is opened }... maybe this can be a way to store data :P

Answer 3

If you want to query the text efficiently, then perhaps putting all bits of information into the DB separately is the most efficient. Maybe you with to play with OOXML or ODF, that may serve as container for all information you require, and then XML-storage (e.g. eXist) to store it and query (e.g. the text). As these standards are XML-based, you can transform them into HTML (e.g. here or here) but writing an online editor for this is something that monster like Google can do.

Answer 4

You can take a look at NoSQL databases like MongoDB or CouchDB

See also Storing images in NoSQL stores