Theory
Write Dart before you install Dart
New language, અને lab machines પાસે કોઈ Dart SDK નથી, કોઈ Flutter નથી, અને queue છે એક admin password માટે.
કોઈ obstacle નથી at all: browser ને open કરો, dartpad.dev visit કરો, અને તમે 10 seconds માં Dart ને write અને run કરી રહ્યા છો, કોઈ પણ પર જેની પાસે screen હોય: lab PC, bus માં તમારો phone.
અને તે convenience ની અંદર hiding છે genuine puzzle worth marks: browsers ફક્ત JavaScript ને run કરે છે: તેથી HOW તમારું Dart એક માં run થઈ રહ્યું છે? answer એ આ lesson નો second tool છે.
Theory
DartPad, formally
DartPad એ Dart નો free online editor છે dartpad.dev પર:
- zero installation: editor, compiler અને console બધા page માં live થાય છે
- instant feedback: type કરો, Run press કરો, output console panel માં appear થાય છે; errors underline થાય છે જેમ તમે type કરો
- shareable: snippets URLs get કરે છે: કેવી રીતે classmates experiments ને swap કરે છે
- core libraries ને support કરે છે (અને તેના Flutter mode માં Flutter samples)
તેની honest limits: કોઈ dart:io નહીં (કોઈ files ને reading અથવા writing નહીં: browser page ને sandboxed કરવામાં આવ્યું છે તમારા disk થી: same law જે BCA405-01 ના browser rules ની પાછળ છે) અને કોઈ arbitrary packages નહીં. practice ground, build tool નહીં.
Practical
આને dartpad.dev માં paste કરો અને Run press કરો
void main() {
var events = ['Garba Night', 'Coding Contest', 'Robo Race'];
int day = 2;
print('TechnoUtsav, day $day');
for (var e in events) {
print(' $e');
}
// Console header અને 3 indented event names ને show કરે છે.
// કોઈ install નહીં, કોઈ SDK નહીં, કોઈ admin password નહીં.
}
Theory
dart2js: translator જે browsers require કરે છે
Browsers natively exactly એક language ને execute કરે છે: JavaScript (BCA405-01 નું આખું world). તેમની પાસે કોઈ Dart engine નથી.
dart2js gap ને closes કરે છે: compiler જે Dart source ને translate કરે છે optimised JavaScript માં:
dart compile js app.dart (modern CLI; classic tool name એ dart2js છે)
Out comes .js file જે કોઈ પણ browser runs કરે છે: તમારું Dart web app, delivered એકમાત્ર currency માં જે browsers accept કરે છે. output lean છે: dart2js analyse કરે છે શું તમારું code actually use કરે છે અને બાકી ને drops કરે છે (dead-code elimination).
અને pleasing loop: DartPad itself આ રીતે work કરે છે: તમારું snippet JS માં compiled થાય છે behind scenes, જે શું છે કેવી રીતે Dart "runs" JS-only browser માં.
Quiz
શા માટે dart2js ને exist કરવાની જરૂર છે at all?
- Dart programs ને native Dart થી faster run કરવા માટે
- કારણ કે browsers natively ફક્ત JavaScript ને execute કરે છે, તેથી Dart ને translate કરવું પડે web સુધી પહોંચવા
- JavaScript projects ને automatically Dart માં convert કરવા માટે
- કારણ કે DartPad loops ને run નથી કરી શકતું તેના વગર
Show the answer
કારણ કે browsers natively ફક્ત JavaScript ને execute કરે છે, તેથી Dart ને translate કરવું પડે web સુધી પહોંચવા
browser એ JavaScript-only runtime છે: કોઈ Dart VM Chrome અથવા Firefox ની અંદર lives નથી કરતું: તેથી Dart નો road to web એ translation છે, અને dart2js એ translator છે. આ mirrors કરે છે Unit 1 of BCA404 (many languages, one MSIL) ને inverted: એક language, compiled જે કંઈ target runtime બોલે તેમાં: phones માટે AOT, browsers માટે JS. Option A direction અને purpose ને misreads છે: compiled JS નો aim hand-written JS ને match કરવાનો છે, native Dart ને beat કરવાનો નહીં. Option C arrow ને reverses કરે છે: કોઈ tool JS ને Dart માં un-translate નથી કરતું. Option D dependency ને invent કરે છે: DartPad dart2js ને use કરે છે browser law ને કારણે, loops માટે નહીં.
Think first
શા માટે DartPad file ને read નથી કરી શકતું?
DartPad માં, import 'dart:io' fails થાય છે, અને કોઈ snippet events.txt ને open નથી કરી શકતું. connect કરો આ limit ને ક્યાં DartPad નું code actually execute થાય છે અને rule જે તમે meet કર્યું હતું BCA405-01 માં, પછી tap.
Show the answer
તમારું snippet runs થાય છે (as compiled JS) browser page ની અંદર, અને browser pages sandboxed છે: visitor ના disk માં reaching નહીં: same security law જે shape કર્યું બધું BCA405-01 માં. dart:io એ Dart ની file-and-process library છે programs માટે running on real machine (command line, servers); browser tab એ that place નથી, તેથી DartPad તેને offer નથી કરી શકતું. practical consequence: file-handling Dart practice ને real SDK ની જરૂર છે real machine પર: exactly command-line route જે next lesson formalise કરે છે.
Watch out
Tool-boundary confusions
DartPad એ "Dart lite" નથી: language full છે; ENVIRONMENT sandboxed છે. loops, classes, functions: બધું core work કરે છે.
dart2js ફક્ત web target માટે છે: phones get AOT native code (last lesson); write ન કરો કે Flutter apps JavaScript તરીકે ship થાય છે.
Compiled JS ને hand-editing માટે નથી: dart2js output machine-optimised છે; તમે Dart ને maintain કરો, ક્યારેય generated .js નહીં: same source-vs-output discipline જેમ દરેક compiler જે તમે meet કર્યું છે.
Theory
એક language, ત્રણ destinations
Draw Dart નું shipping map once: developing દરમિયાન JIT, phones માટે AOT native, browsers માટે dart2js: એક source, ત્રણ runtimes, દરેક getting શું તે execute કરી શકે. તે map answers આ unit ના why-questions ને એક figure માં. next lesson tooling story ને completes કરે છે: 3 WAYS Dart ને execute કરવા (command line, DartPad, IDE) અને ક્યારે દરેક earns કરે છે તેનું place તમારા week માં.
Summary
Key takeaways
- DartPad (dartpad.dev): zero-install browser editor: type, Run, console output, shareable snippets.
- તેના sandbox limits: કોઈ dart:io (કોઈ files નહીં), કોઈ arbitrary packages નહીં: practice ground, build tool નહીં.
- Browsers ફક્ત JavaScript ને execute કરે છે: dart2js Dart ને optimised JS માં translate કરે છે web માટે.
- Modern spelling: dart compile js app.dart; output lean છે dead-code elimination દ્વારા.
- DartPad itself તમારા code ને run કરે છે તેને JS માં compile કરીને behind scenes.
- Phones get AOT native code; web gets JS: એક language, per-target delivery.
- Memory hook: pad practise કરે છે, dart2js translate કરે છે, browser ફક્ત JS બોલે છે.