WebGL

Σχεδιασμός

Το WebGL 1.0 βασίζεται στο OpenGL ES 2.0 και παρέχει ένα API για γραφικά 3D. [5] Χρησιμοποιεί το στοιχείο καμβά HTML5 και προσπελάζεται χρησιμοποιώντας διεπαφές μοντέλου αντικειμένων εγγράφου (DOM Object Model ).
Το WebGL 2.0 βασίζεται στο OpenGL ES 3.0 και παρέχει εγγυημένη διαθεσιμότητα πολλών προαιρετικών επεκτάσεων του WebGL 1.0 και εκθέτει νέα API. [6]
Η αυτόματη διαχείριση μνήμης είναι μια λειτουργία που παρέχεται σιωπηρά καθώς η γλώσσα προγραμματισμού που χρησιμοποιείται / χρησιμοποιείται είναι γλώσσα JavaScript . [4]
Όπως το OpenGL ES 2.0, το WebGL δεν διαθέτει τα API σταθερής λειτουργίας που έχουν εισαχθεί στο OpenGL 1.0 και έχουν καταργηθεί στο OpenGL 3.0. Αυτή η λειτουργικότητα, εάν απαιτείται, πρέπει να εφαρμοστεί από τον ίδιο τον τελικό προγραμματιστή, παρέχοντας τον κώδικα shader και τη ρύθμιση των δεσμεύσεων δεδομένων στη γλώσσα JavaScript.
Οι Shaders στο WebGL εκφράζονται απευθείας στο GLSL και μεταβιβάζονται στο API WebGL ως κορδόνες κειμένου. Η εφαρμογή WebGL μεταγλωττίζει αυτές τις οδηγίες shader σε κώδικα GPU. Αυτός ο κώδικας εκτελείται για κάθε κορυφή που στέλνεται μέσω του API και για κάθε εικονοστοιχείο που ραστεροποιείται στην οθόνη.

Ιστορία

Το WebGL εξελίχθηκε από τα πειράματα 3D Canvas που ξεκίνησε ο Vladimir Vukićević στο Mozilla . Ο Vukićević παρουσίασε για πρώτη φορά το πρωτότυπο Canvas 3D το 2006. Μέχρι τα τέλη του 2007, τόσο τα Mozilla [7] όσο και η Opera [8] είχαν κάνει ξεχωριστές εφαρμογές.
Στις αρχές του 2009, η μη κερδοσκοπική τεχνολογική κοινοπραξία Khronos Group ξεκίνησε την ομάδα εργασίας WebGL, με αρχική συμμετοχή από την Apple , Google , Mozilla, Opera και άλλους. [4] [9] Η έκδοση 1.0 της προδιαγραφής WebGL κυκλοφόρησε τον Μάρτιο του 2011. [1] Από τον Μάρτιο του 2012, ο πρόεδρος της ομάδας εργασίας είναι ο Ken Russell.
Οι πρώτες εφαρμογές του WebGL περιλαμβάνουν το Zygote Body . [10] [11] Το Νοέμβριο του 2012, η Autodesk ανακοίνωσε ότι μεταφέρει τις περισσότερες από τις εφαρμογές τους στο cloud που εκτελείται σε τοπικούς πελάτες WebGL. Αυτές οι εφαρμογές περιελάμβαναν το Fusion 360 και το AutoCAD 360. [12]
Η ανάπτυξη της προδιαγραφής WebGL 2 ξεκίνησε το 2013 με τελικό τον Ιανουάριο του 2017. [13] Αυτή η προδιαγραφή βασίζεται στο OpenGL ES 3.0. [14] Οι πρώτες υλοποιήσεις είναι στο Firefox 51, Chrome 56 και Opera 43. [15]

Υποστήριξη

Το WebGL υποστηρίζεται ευρέως σε σύγχρονα προγράμματα περιήγησης. Ωστόσο, η διαθεσιμότητά του εξαρτάται από άλλους παράγοντες, όπως η GPU που την υποστηρίζει. Ο επίσημος ιστότοπος WebGL προσφέρει μια απλή σελίδα δοκιμής. [16] Παρέχονται λεπτομερέστερες πληροφορίες (όπως το περιεχόμενο του προγράμματος περιήγησης που χρησιμοποιεί το πρόγραμμα περιήγησης και ποιες επεκτάσεις είναι διαθέσιμες) σε ιστότοπους τρίτων μερών. [17] [18]

Επιτραπέζια προγράμματα περιήγησης

Το Google Chrome - Το WebGL 1.0 έχει ενεργοποιηθεί σε όλες τις πλατφόρμες που διαθέτουν ικανή κάρτα γραφικών με ενημερωμένα προγράμματα οδήγησης από την έκδοση 9 που κυκλοφόρησε τον Φεβρουάριο του 2011. [19] [20] Από προεπιλογή στα Windows, το Chrome χρησιμοποιεί το ANGLE (Almost Native Graphics Layer Engine ) renderer για να μεταφράσει OpenGL ES σε Direct X 9.0c ή 11.0, τα οποία έχουν καλύτερη υποστήριξη οδηγού. [21] Σε Linux και Mac OS X ο προεπιλεγμένος επεξεργαστής είναι OpenGL εντούτοις. [22] Είναι επίσης δυνατό να αναγκάσετε το OpenGL να είναι ο επεξεργαστής στα Windows. [21] Από το Σεπτέμβριο του 2013, το Chrome διαθέτει επίσης ένα νεότερο πρόγραμμα αναπαραγωγής Direct3D 11, το οποίο ωστόσο απαιτεί νεότερη κάρτα γραφικών. [23] [24] Το Chrome 56+ υποστηρίζει WebGL 2.0.
Το Mozilla Firefox - WebGL 1.0 έχει ενεργοποιηθεί σε όλες τις πλατφόρμες που διαθέτουν ικανή κάρτα γραφικών με ενημερωμένα προγράμματα οδήγησης από την έκδοση 4.0. [25] Από το 2013 και μετά, ο Firefox χρησιμοποιεί το DirectX στην πλατφόρμα Windows μέσω ANGLE . [21] Το Firefox 51+ υποστηρίζει WebGL 2.0.
Midori
Safari - Safari 6.0 και νεότερες εκδόσεις που έχουν εγκατασταθεί στο OS X Mountain Lion , το Mac OS X Lion και το Safari 5.1 στο Mac OS X Snow Leopard υλοποίησαν την υποστήριξη για το WebGL 1.0, το οποίο απενεργοποιήθηκε από προεπιλογή πριν από το Safari 8.0. [26] [27] [28] [29] [30]
Opera - Το WebGL 1.0 έχει υλοποιηθεί στις Opera 11 και 12, παρόλο που ήταν απενεργοποιημένο από προεπιλογή το 2014. [31] [32] Το Opera 43+ υποστηρίζει το WebGL 2.0.
Internet Explorer - Το WebGL 1.0 υποστηρίζεται εν μέρει στον Internet Explorer 11 . [33] [34] [35] [36] Αρχικά απέτυχε η πλειοψηφία των επίσημων δοκιμών συμμόρφωσης WebGL, αλλά η Microsoft δημοσίευσε αργότερα αρκετές ενημερώσεις. Ο τελευταίος κινητήρας WebGL 0,94 βρίσκεται σήμερα στο ~ 97% των δοκιμών Khronos. [37] Η υποστήριξη WebGL μπορεί επίσης να προστεθεί με μη αυτόματο τρόπο σε προηγούμενες εκδόσεις του Internet Explorer χρησιμοποιώντας πρόσθετα τρίτων όπως το IEWebGL. [38]
Microsoft Edge - Η αρχική σταθερή έκδοση υποστηρίζει WebGL έκδοση 0.95 (όνομα περιβάλλοντος: "experimental-webgl") με ανοιχτού κώδικα GLSL σε HLSL transpiler . [39] Η έκδοση 10240+ υποστηρίζει το WebGL 1.0 ως πρόθεμα. Το WebGL 2.0 σχεδιάζεται με μεσαία προτεραιότητα στις μελλοντικές εκδόσεις. [40]
Βιβάλντι
Κινητά προγράμματα περιήγησης 
Το BlackBerry 10 - Το WebGL 1.0 είναι διαθέσιμο για συσκευές BlackBerry από την έκδοση 10.00 [41]
Το BlackBerry PlayBook - Το WebGL 1.0 είναι διαθέσιμο μέσω του WebWorks και του προγράμματος περιήγησης στο PlayBook OS 2.00 [42]
Πρόγραμμα περιήγησης Android - Βασικά δεν υποστηρίζεται, αλλά η σειρά smartphones της Sony Ericsson Xperia των smartphone Android είχε δυνατότητες WebGL μετά από αναβάθμιση υλικολογισμικού. [43] Τα smartphone της Samsung διαθέτουν επίσης δυνατότητα WebGL (επαληθεύεται στο Galaxy SII (4.1.2) και στο Galaxy Note 8.0 (4.2)). Υποστηρίζεται στο Google Chrome που αντικατέστησε το πρόγραμμα περιήγησης Android σε πολλά τηλέφωνα (αλλά δεν αποτελεί νέο πρότυπο πρόγραμμα περιήγησης Android).
Internet Explorer - Το προρυθμισμένο WebGL 1.0 είναι διαθέσιμο στο Windows Phone 8.x (11+)
Firefox για κινητά - Το WebGL 1.0 είναι διαθέσιμο για συσκευές Android και MeeGo από τον Firefox 4. [44] [45]
Firefox OS [45]
Το Google Chrome - Το WebGL 1.0 είναι διαθέσιμο για συσκευές Android από το Google Chrome 25 και είναι ενεργοποιημένο από προεπιλογή από την έκδοση 30. [46]
Maemo - Στο Nokia N900 , το WebGL 1.0 είναι διαθέσιμο στο μικροεπεξεργαστή μικροεπεξεργαστών από την ενημερωμένη έκδοση firmware PR1.2 και μετά. [47]
Το MeeGo - Το WebGL 1.0 δεν υποστηρίζεται στο φυλλομετρητή "Web". Ωστόσο, είναι διαθέσιμο μέσω του Firefox. [45]
Το Microsoft Edge - Πρόχειρο WebGL 1.0 είναι διαθέσιμο στα Windows 10 Mobile. [48]
Opera Mobile - Το Opera Mobile 12 υποστηρίζει το WebGL 1.0 (μόνο σε Android). [49]
Sailfish OS - Το WebGL 1.0 υποστηρίζεται στο προεπιλεγμένο πρόγραμμα περιήγησης Sailfish. [50]
Tizen - Το WebGL 1.0 υποστηρίζεται [51]
Ubuntu Touch
WebOS
Το iOS - WebGL 1.0 είναι διαθέσιμο για το κινητό Safari, στο iOS 8 . [52]
Δημιουργία περιεχομένου και οικοσύστημα 
Το API WebGL μπορεί να είναι πολύ κουραστικό για άμεση χρήση χωρίς κάποιες βιβλιοθήκες χρησιμότητας, οι οποίες για παράδειγμα ρυθμίζουν τυπικούς shaders μετασχηματισμού προβολής π.χ. Η φόρτωση γραφημάτων σκηνών και τρισδιάστατων αντικειμένων στις δημοφιλείς μορφές βιομηχανίας δεν προβλέπεται επίσης άμεσα. Οι βιβλιοθήκες JavaScript έχουν δημιουργηθεί (ή μερικές φορές μεταφέρονται στο WebGL) για να παρέχουν τις πρόσθετες λειτουργίες. Μια μη εξαντλητική λίστα βιβλιοθηκών που παρέχει πολλές δυνατότητες υψηλού επιπέδου περιλαμβάνει τα A-Frame (VR) , BabylonJS , PlayCanvas , three.js , OSG.JS και CopperLicht . Υπήρξε επίσης μια ταχεία εμφάνιση των μηχανών παιχνιδιών για το WebGL, [53] συμπεριλαμβανομένου του Unreal Engine 4 και της Unity . [54] Η βιβλιοθήκη υψηλού επιπέδου Away3D με βάση το Stage3D / Flash έχει επίσης μια θύρα στο WebGL μέσω TypeScript . [23] [55] Μια πιο ελαφριά βιβλιοθήκη χρησιμότητας που παρέχει μόνο τα βοηθητικά προγράμματα μαθηματικών και μαθηματικών μαθηματικών για shaders είναι sylvester.js. [56] [57] Μερικές φορές χρησιμοποιείται σε συνδυασμό με μια επέκταση WebGL που ονομάζεται glUtils.js. [56] [58]
Υπάρχουν επίσης 2D βιβλιοθήκες που έχουν χτιστεί πάνω από το WebGL όπως το Cocos2d -x ή το Pixi.js , οι οποίες υλοποιήθηκαν με αυτόν τον τρόπο για λόγους απόδοσης, σε μια κίνηση που συμπίπτει με το τι συνέβη με το Starling Framework πάνω από το Stage3D στον κόσμο του Flash. Οι 2D βιβλιοθήκες που βασίζονται στο WebGL επιστρέφουν στον καμβά HTML5 όταν το WebGL δεν είναι διαθέσιμο. [59]
Η κατάργηση του σημείου συμφόρησης με απόδοση σχεδόν άμεσης πρόσβασης στη GPU περιόρισε επίσης τους περιορισμούς των επιδόσεων στις υλοποιήσεις JavaScript. Μερικοί αντιμετωπίστηκαν από το asm.js. (Ομοίως, η εισαγωγή των προβλημάτων απόδοσης που εκτίθενται στο Stage3D στο ActionScript , τα οποία αντιμετωπίστηκαν από έργα όπως το CrossBridge .) [59]
Η δημιουργία περιεχομένου για σκηνές WebGL σημαίνει συχνά τη χρήση ενός κανονικού εργαλείου δημιουργίας τρισδιάστατου περιεχομένου και την εξαγωγή της σκηνής σε μορφή που μπορεί να διαβαστεί από τη θεατή ή τη βοηθητική βιβλιοθήκη. Το λογισμικό δημιουργίας επιφάνειας εργασίας 3D, όπως το Blender , το Autodesk Maya ή το SimLab Composer, μπορούν να χρησιμοποιηθούν για το σκοπό αυτό. Συγκεκριμένα, το Blend4Web επιτρέπει σε μια σκηνή WebGL να δημιουργείται εξ ολοκλήρου στο Blender και να εξάγεται σε ένα πρόγραμμα περιήγησης με ένα μόνο κλικ, ακόμη και ως αυτόνομη ιστοσελίδα. [60] Υπάρχουν επίσης ορισμένα λογισμικά που σχετίζονται με το WebGL, όπως το CopperCube και ο διαδικτυακός επεξεργαστής Clara.io που βασίζεται στο WebGL . Οι ηλεκτρονικές πλατφόρμες όπως το Sketchfab και το Clara.io επιτρέπουν στους χρήστες να φορτώνουν απευθείας τα μοντέλα τους 3D και να τα προβάλλουν χρησιμοποιώντας έναν φιλοξενούμενο WebGL θεατή.
Επιπλέον, το Mozilla Foundation, στον browser του Firefox, έχει ενσωματώσει ενσωματωμένα εργαλεία WebGL που ξεκινούν με την έκδοση 27 και επιτρέπουν την επεξεργασία κορυφών και θραυστήρων θραυσμάτων. [61] Έχουν εμφανιστεί επίσης ορισμένα άλλα εργαλεία εντοπισμού σφαλμάτων και εντοπισμού προφίλ. [62]
Το X3D έκανε επίσης ένα έργο που ονομάζεται X3DOM για να κάνει το περιεχόμενο X3D και VRML να τρέχει στο WebGL. Το τρισδιάστατο μοντέλο σε ετικέτα XML <X3D> σε HTML5 και σε διαδραστικό σενάριο θα χρησιμοποιεί JavaScript και DOM. Ο BS Content Studio και ο InstantReality X3D εξαγωγέας μπορούν να εξάγουν το X3D σε HTML και να τρέχουν από το WebGL. [ παραπομπή που απαιτείται ]
Το Verge3D προτείνει μια προσέγγιση οπτικής δέσμης ενεργειών για τη δημιουργία διαδραστικών εφαρμογών WebGL με βάση το Google Blockly (παζλ) και έναν αγωγό γραφικών που αξιοποιεί τα διαθέσιμα εργαλεία DCC όπως το Autodesk 3ds Max ή το Blender . [63]