1.

State difference between SVG (Scalable Vector Graphics) and Canvas.

Answer»

HTML5 introduced two new graphical elements, Canvas (<canvas>) and SVG (<svg>), that make your web pages more interactive and more graphically attractive. Each has its own PROPERTIES and can be used to create graphic elements on web pages.

<svg> tag<canvas> tag
In web pages, SVG is used to define VECTOR-based graphics (vector image format). Unlike raster images (ex. .jpg, .gif, .png, etc. ), vector images can be stretched or compressed without LOSING quality.Canvas is a raster-based format composed of pixels.
SVG provides better scalability, enabling HIGH-quality printing at any resolution.The canvas is not suitable for printing at high resolutions since it has poor scalability.
Through scripting and CSS, SVG can be modified.Modifying a canvas is only possible through the script.
The performance of SVG is better when dealing with FEWER objects (<10k) or larger surfaces.Canvas performs better when there is a smaller surface area or a larger number of objects (>10k).


Discussion

No Comment Found

Related InterviewSolutions