HTML 5 Canvas κατά opposed SVG
Το canvas και το SVG επιτρέπουν την δημιουργία γραφημάτων στο περιηγητή, αλλά είναι根本 different.
SVG
Το SVG είναι μια γλώσσα που χρησιμοποιεί XML για την περιγραφή 2D γραφημάτων.
Το SVG βασίζεται στο XML, αυτό σημαίνει ότι κάθε στοιχείο στο SVG DOM είναι διαθέσιμο. Μπορείτε να προσθέσετε επεξεργαστές γεγονότων JavaScript σε ένα στοιχείο.
Στο SVG, κάθε γραφικό που αποδίδεται θεωρείται αντικείμενο. Αν οι ιδιότητες του αντικειμένου SVG αλλάξουν, ο περιηγητής μπορεί να επαναδημιουργήσει αυτόματα το γραφικό.
Canvas
Το canvas χρησιμοποιεί JavaScript για την απόδοση 2D γραφημάτων.
Το canvas απόδοση γίνεται πίνακα.
Στο canvas, μετά την ολοκλήρωση της απόδοσης των γραφημάτων, δεν συνεχίζει να λαμβάνει προσοχή από τον περιηγητή. Αν η θέση του αλλάξει, η ολόκληρη η σκηνή πρέπει να επαναδιαγραφεί, συμπεριλαμβανομένων των οποίωνδήποτε αντικειμένων μπορεί να καλύπτονται από τα γραφήματα.
Σύγκριση Canvas και SVG
Το παρακάτω τραπέζιο αναφέρει μερικές από τις διαφορές μεταξύ canvas και SVG.
Canvas
- Εξαρτάται από την ανάλυση
- Δεν υποστηρίζει επεξεργαστές γεγονότων
- Αδύνατη απόδοση κειμένου
- Μπορεί να αποθηκεύσει τις εικόνες αποτελεσμάτων σε μορφή .png ή .jpg
- Τα πιο κατάλληλα για παιχνίδια με μεγάλη χρήση εικόνων, όπου πολλά αντικείμενα θα ανανεώνονται συχνά
SVG
- Δεν εξαρτάται από την ανάλυση
- Υποστήριξη επεξεργαστών γεγονότων
- Τα πιο κατάλληλα για εφαρμογές με μεγάλη περιοχή απόδοσης (π.χ. Google Maps)
- Υψηλή πολυπλοκότητα μειώνει την ταχύτητα απόδοσης (όλες οι εφαρμογές που χρησιμοποιούν υπερβολικά τον DOM δεν είναι γρήγορες)
- Μη κατάλληλο για εφαρμογές παιχνιδιών
