আমি কীভাবে জেএস গেমটি ডাউনলোডযোগ্য করে তুলব?


20

আমি একই .htmlফাইলটিতে এইচটিএমএল এবং জাভাস্ক্রিপ্ট একসাথে রাখতে পারি , তবে চিত্রগুলি পৃথক ফাইল হওয়া দরকার। আমার মনে আসার একমাত্র সমাধান হ'ল ব্যবহারকারীকে একটি .zipফোল্ডার দেওয়া।

যদিও এটি সুন্দর নয় ... আমি আর কীভাবে এটি করতে পারি?


8
"স্ট্যান্ডার্ড" জেএস গেমগুলি ডাউনলোডযোগ্য করে তোলার জন্য নয় ; তারা কেবল একটি ব্রাউজারে কাজ করে। এটি করার কিছু অস্পষ্ট উপায় থাকতে পারে তবে খোলামেলাভাবে কেন এটি বাধ্য করুন: কাজের জন্য সঠিক সরঞ্জামটি ব্যবহার করুন।
12'9 এ ঝাঁকুনি

উত্তর:


21

আপনি ডেটাআরএল-সিনট্যাক্স ব্যবহার করে এইচটিএমএল ডকুমেন্টে চিত্রগুলি এম্বেড করতে পারেন যা বাইনারি চিত্রের ডেটাটির বেস 64 প্রতিনিধিত্বকে একটি চিত্রের এসআরসি-বৈশিষ্ট্য হিসাবে রাখতে দেয়। এটি অন্য যে কোনও ধরণের মিডিয়া ফাইলেও কাজ করে।

<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAIAAAACUFjqAAAABGdBTUEAALGPC/xhBQAAAAlwSFlzAAALEgAACxIB0t1+/AAAAAd0SU1FB9EFBAoYMhVvMQIAAAAtSURBVHicY/z//z8DHoBH+v///yy4FDEyMjIwMDDhM3lgpaEuh7gTEzDiDxYA9HEPDF90e5YAAAAASUVORK5CYII=">

আপনি যখন সিএসএস স্টাইলশিটগুলি ব্যবহার করেন, আপনি জাভাস্ক্রিপ্টে এগুলি সম্পূর্ণ পদ্ধতিগত তৈরি করতে পারেন।


অবশ্যই বেস 64 আরও বেশি জায়গা নেয়, যা ফাইলের আকারকে চারগুণ করে ...
টোবিয়াস কেইনজলার

10
@ তোবিয়াস কিইনজলার: *৪ * 4 = 256 এর অর্থ এই নয় যে একক বাইট এনকোড করতে 4 বারের বেশি ডেটা লাগবে, তবে আপনি প্রতি বাইটে প্রতি 8 টির মধ্যে 6 টি বিট (2 ** 6 = 64) ব্যবহার করেন। এর অর্থ হল 3 বাইটগুলি এনকোড করতে 4 বাইট লাগবে, যা আকারের 33% বৃদ্ধি দেয় (প্রয়োজনে প্যাডিং গণনা করা হয় না)। শক্তভাবে চতুর্থাংশ। একমাত্র বাইটকে এনকোড করার সময় কেবলমাত্র ডাটা আকারে চতুর্ভুজ হয়, যার জন্য 2 ডেটা বাইট প্লাস 2 প্যাডিং বাইট প্রয়োজন।
পান্ডা পাইজামা

2
@ পান্ডপাজামা আমার খারাপ, আমি "এক চতুর্থাংশের" বৃদ্ধি (2/8 = 1/4 নষ্ট বিটের কারণে) বলতে চাইছি। যদিও সেখানে স্পষ্টতই আমি একটি ভুল করেছি, 33% আপনি প্রাপ্ত সঠিক। তবুও এটি একটি ওভারহেড, ইমেল সংযুক্তিগুলি থেকেও "বিখ্যাত"
টোবিয়াস কেইনজলার

1
সেই বেসটি কি .wav, .ogg, .m4a, এবং সাধারণভাবে কোনও ফাইলের মতো অন্যান্য সংস্থার জন্য কাজ করবে?
DrZ214

1
@ DrZ214 আমি চেষ্টা করে দেখিনি, তবে আফ্রিকের যেখানেই কোনও ইউআরএল যেখানে কাজ করে সেখানে কাজ করা উচিত।
ফিলিপ

31

কেবলমাত্র একটি জিপ ফাইলের মধ্যে সমস্ত ফাইল স্থাপন করা একটি কার্যকর সমাধান নয় কারণ বেশিরভাগ ওয়েব-অ্যাপ্লিকেশনগুলিতে একটি ওয়েব-সার্ভারের প্রয়োজন হয় যাতে তারা এইচটিটিপি-অনুরোধের মাধ্যমে সংস্থানগুলি অ্যাক্সেস করতে পারে। কিছু সিস্টেমে আপনি এর মাধ্যমে ফাইল অ্যাক্সেস করতে পারেনfile:// ইউআরআই-স্কিমের তবে সুরক্ষা-কারণগুলির কারণে সর্বত্র এটি কাজ করার গ্যারান্টিযুক্ত নয় এবং এজ্যাক্স অনুরোধের মতো জিনিসগুলির জন্য ব্যর্থ হবে।

এটি খুব সহজ অ্যাপ্লিকেশনটির জন্য কাজ করতে পারে যেখানে আপনার সর্বাধিক সংস্থানগুলি ইনলাইন রয়েছে তবে এটি সত্যিই সেই পদ্ধতির নয় যা আমি কারও কাছে সুপারিশ করব। বিকল্প আছে যদিও, যেমন:

একটি স্থানীয় অ্যাপ্লিকেশন তৈরি করুন

আপনি নোড-ওয়েবকিট ব্যবহার করে নেটিভ অ্যাপ্লিকেশন হিসাবে আপনার ওয়েব-অ্যাপ্লিকেশনটিকে প্যাকেজ করতে পারেন । এমনকি আপনি আপনার গেমটিতে দেশীয় ডেস্কটপ বৈশিষ্ট্যগুলি (যেমন স্থানীয় সেভ-গেমস) যুক্ত করতে এটি ব্যবহার করতে পারেন।

এটি কোনও " প্যাকেজ এবং সম্পন্ন হয়নি " পদ্ধতি নয় যদিও আপনাকে সম্ভবত আপনার অ্যাপ্লিকেশনটির অংশগুলি আবার লিখতে হবে এবং বিভিন্ন লোডার লিখতে হবে (উদাহরণস্বরূপ, একটি ডেস্কটপ অ্যাপ্লিকেশন দিয়ে আপনি ফাইল সিস্টেমের মাধ্যমে ফাইলগুলি লোড করবেন, আপনি এইচটিটিপি ব্যবহার করার সময় ব্রাউজারে / অনলাইন-গেমের অনুরোধগুলি)।

আপনার অ্যাপ্লিকেশনটিতে অফলাইন অ্যাক্সেসের অনুমতি দিতে HTML5 বৈশিষ্ট্যগুলি ব্যবহার করুন

যদি আপনার প্রাথমিক লক্ষ্যটি প্লেয়ারটিকে আপনার গেমটি অফলাইনে খেলতে দেয় তবে আপনি আপনার অ্যাপ্লিকেশনটিতে অফলাইনে অ্যাক্সেসের অনুমতি দিতে অ্যাপ্লিকেশন-ক্যাশে ব্যবহার করতে পারেন । এটি এমন একটি বৈশিষ্ট্য যা বেশিরভাগ আধুনিক ব্রাউজারে কাজ করে । যুক্ত হওয়া সুবিধাটি হ'ল ব্যবহারকারীর কোনও কিছু ডাউনলোড করতে হবে না এবং অফলাইনে থাকা অবস্থায়ও আপনার গেমটি খেলতে কেবল বুকমার্ক ব্যবহার করতে পারেন।

সংশ্লেষপূর্ণভাবে লোড হচ্ছে এমন সংস্থানগুলির জন্য (এজেএক্স) আপনাকে পৃথক লোডিং প্রক্রিয়াও প্রয়োগ করতে হবে। আপনি অফলাইনে ব্যবহারের জন্য এই সংস্থানগুলি সংরক্ষণ করতে স্থানীয়-স্টোরেজ ব্যবহার করতে পারেন।


2
নোড-ওয়েবকিটটি বেশ বড়, এবং যদি আপনি এটি অন্তর্ভুক্ত করেন তবে একটি "হ্যালো ওয়ার্ল্ড" জেএস গেমের জন্য 60 এমবি জাতীয় কিছু শেষ করবেন।
ashes999

1
আপনার অ্যাপ্লিকেশন এমনকি দূর থেকে জটিল হলে এটি সঠিক উত্তর।
ভান হিলস

1
@ ashes999 আমি আপনার সাথে একমত, এখনও 60MB আজকাল একটি ডেস্কটপ অ্যাপ্লিকেশন জন্য খুব ছোট। প্রচুর সাধারণ-উদ্দেশ্য ফ্রেমওয়ার্কগুলি কিছু ফাইল-আকারের ওভারহেড তৈরি করে (ইউনিটিটিকে একটি বিশিষ্ট উদাহরণ হিসাবে গ্রহণ করুন)। ক্রমবর্ধমান স্টোরেজ স্পেসের সাথে, সুবিধা ফাইল-আকারের উপরে জয়ী হয়;)
বাম্মজ্যাক

2
পছন্দ করুন আপনি কোনও আর্ট বা অডিও যুক্ত করার আগে একটি ~ 100 কেবি জেএস গেমটি নেওয়া এবং এটি 60 এমবিতে পরিণত হয়ে উঠতে কেবল হতাশাজনক। আশা করি কেউ আরও ভাল উপায় নিয়ে আসবেন। +1
বিটিডব্লিউ

1
যদিও এই উত্তরে প্রচুর দরকারী তথ্য রয়েছে, তবে প্রধান বাক্যটি সম্পূর্ণ ভুল। আপনি জাভাস্ক্রিপ্ট ফাইলগুলিতে গেমের ডেটা রাখতে পারেন, আধুনিক ব্রাউজারগুলি জাভাস্ক্রিপ্টের কমপক্ষে কয়েক এমবি হ্যান্ডেল করতে সক্ষম হওয়া উচিত এবং যতক্ষণ আপনি কোনও ক্যানভাস থেকে চিত্রের ডেটা পড়ার চেষ্টা করবেন না ততক্ষণ চিত্র ফাইলগুলি ব্যবহার করার ক্ষেত্রে কোনও ভুল নেই either । গতবার আমি যাচাই করেছি, সমস্ত আধুনিক ব্রাউজারগুলি file:///প্রোটোকলটি অ্যাক্সেসের অনুমতি দেয় localStorageযা সংরক্ষণের জন্য কাজ করে। এটি অনলাইন প্লে ব্যতীত কোনও এইচটিএমএল গেমটিতে যে কিছু করতে পারে তা করতে স্কেল করবে।
আআআআআআআআআআআআআআআআআআআআআআআআআআআআআআআআ

7

গেমটি অফলাইনে চালিত করতে এবং কিছু নেটিভ কার্যকারিতা উপভোগ করার জন্য একটি ক্রোম-ভিত্তিক সমাধানের জন্য, আপনি একটি Chrome অ্যাপ তৈরির কথা বিবেচনা করতে পারেন ।

এইভাবে, আপনি এটিকে ক্রম ওয়েব স্টোরে যুক্ত দৃশ্যমানতার জন্য বিতরণ করতে পারেন, আপনি কয়েকটি শক্তিশালী এপিআই উপভোগ করতে পারেন এবং এটিকে স্ট্যান্ডেলোন অ্যাপের মতো দেখতে আরও সুন্দর করতে পারেন ।

ডাউনসাইডটি অবশ্যই ক্রোমের প্রয়োজন।


1
ফায়ারফক্স (এবং ফায়ারফোজ ওএস) এর ওপেনওয়েব অ্যাপস ( বিকাশকারী.মোজিলা.আর / অ্যাপস / কিউইকিস্টার্ট / বিল্ড / ২ ) রয়েছে যা এর অনুরূপ: ওয়েব অ্যাপ্লিকেশন আইডি অ্যাপ্লিকেশন হিসাবে ইনস্টল করা হিসাবে ডাউনলোড করা হয়েছে। উভয় সমাধানের একটি সাধারণ মানের রূপান্তর করা উচিত: html5doctor.com/web-manifest-specifications । পাশাপাশি দেখুন: কোড. google.com/p/chromium/issues/detail?id=366145
ysdx

@ysdx আপনি যে রূপান্তরকারী মানটির কথা উল্লেখ করেছেন তা হ'ল ক্রোম "হোস্টেড অ্যাপ্লিকেশনগুলি" বলে যা সত্যিকারের স্ব-অন্তর্ভুক্ত, ডাউনলোডযোগ্য অ্যাপ্লিকেশানের বিপরীতে, "প্যাকেজড অ্যাপ" নামে পরিচিত। একই পরিভাষা ফায়ারফক্সে প্রযোজ্য। দুর্ভাগ্যক্রমে, প্যাকেজড অ্যাপ্লিকেশনগুলি স্থাপত্যগতভাবে খুব আলাদা এবং রূপান্তরিত হওয়ার সম্ভাবনা কম।
Xan

@ Xan একটি প্যাকেজড অ্যাপ কী? ফায়ারফক্স এবং ক্রোম অ্যাপ স্টোরগুলিতে কি 'হোস্টেড' এবং 'প্যাকেজড' অ্যাপ্লিকেশনগুলি উপলব্ধ?
কিউসিগমা

1
@ কিসিগমা একটি প্যাকেজড অ্যাপ্লিকেশনটি বেশিরভাগ স্ব-অন্তর্ভুক্ত HTML5 অ্যাপ্লিকেশন যা স্থানীয় ফাইল সিস্টেম অ্যাক্সেসের মতো শক্তিশালী এপিআইগুলিতে অ্যাক্সেস সহ; এটি "প্যাকেজড" কারণ এটি একটি ডাউনলোডে এটির নিজস্ব সংস্থান রয়েছে। একটি "হোস্টেড" অ্যাপ্লিকেশনটি মূলত কিছু মেটাডেটা যুক্ত কোনও ওয়েবসাইটের লিঙ্ক। এটিকে শর্টকাট এবং বুকমার্কের মধ্যে ক্রস হিসাবে ভাবেন। আমি ফায়ারফক্সের স্টোর সম্পর্কে বলতে পারি না, তবে প্রথম মন্তব্য থেকে প্রাপ্ত ডকুমেন্টেশনে প্যাকেজড অ্যাপ্লিকেশনগুলি কীভাবে লিখতে হয় তা বর্ণনা করা হয়।
Xan

আরও কোটা এবং অনুমতি নিয়ে আরও ডাউনলোড না করে অ্যাপ্লিকেশনটি ক্লিক করা এবং অফলাইনে চালানো এবং আরও কোটা এবং অনুমতি নিয়ে আরও ডাউনলোড ছাড়াই অ্যাপ্লিকেশনটি চালানো এবং চালানোর মধ্যে পার্থক্য কী? প্রযুক্তিগতভাবে তাদের পার্থক্য থাকা সত্ত্বেও, এই পার্থক্যগুলি অতিমাত্রায়, ব্যবহারকারীর পক্ষে কোনও পার্থক্য নেই। সঠিকভাবে নকশা করা হোস্ট করা অ্যাপ্লিকেশনটির প্যাকেজিং সঠিক ম্যানিফিসেটগুলির সাথে বেশ তুচ্ছ হওয়া উচিত। প্যাকেজড অ্যাপ্লিকেশনটির খারাপ দিকটি হ'ল এটি কোনও বাহ্যিক প্যাকেজ ম্যানেজার ব্যতীত নিজেকে আপডেট করতে পারে না, হোস্ট করা অ্যাপের সাহায্যে ব্রাউজারটি নিজেই প্যাকেজ পরিচালক।
মিথ্যা রায়ান

0

ভাল এটি নির্ভর করে আপনি সত্যিই এটিতে কতটা কাজ রাখতে চান। আপনি করতে পারেন ওয়েব API এর বর্তমান সেটটি ব্যবহার করে:

  • একটি প্রগতিশীল ওয়েব অ্যাপ্লিকেশন (পিডব্লিউএ) তৈরি করুন (দুঃখজনকভাবে পিডাব্লুএগুলি কেবল মোবাইল ফোন এবং ক্রোম ওএসের জন্য, তবে আমি শুনেছি যে শীঘ্রই ডেস্কটপের জন্য ক্রোম এর পক্ষে শীঘ্রই সমর্থন পাবে now আপাতত, এটি একটি পতাকার পিছনে লুকায়) পুরানো অ্যাপ্লিকেশন থেকে ক্যাশে এখন হ্রাস করা হয়েছে
  • সবকিছুকে পাঠ্যে রূপান্তর করুন ( চিত্র এবং অডিও )। এবং হয় ব্যবহারকারীকে ওয়েব পৃষ্ঠাটিকে সেভাবে সংরক্ষণ করতে উত্সাহিত করুন (ব্যবহার Cmd+Sবা ব্যবহার করেCtrl+S ব্রাউজারে) বা পিডাব্লুএ হিসাবে পৃষ্ঠাটি ক্যাশে করুন। কেবল তা জেনে রাখুন, মোবাইলে ডেটা ইউআরআই খুব ভাল সম্পাদন করে না।
  • আপনি একটি Chrome অ্যাপ্লিকেশন তৈরি করতে পারেন , তবে এটি Chrome OS এ চলমান কোনও ক্রোম সংস্করণে কাজ করবে না । এর অর্থ আপনার জন্য কোনও এক্সটেনশন তৈরি করা ভাল পরিবর্তে
  • বেশিরভাগ গেমগুলি 10 মেগাবাইটের অধীনে আসে, এটির সাহায্যে আপনি আপনার গেমের সমস্ত ডেটা স্থানীয় স্টোরেজে ক্যাশে রাখতে পারবেন। আপনি এটি কীভাবে করবেন তা আপনার উপর নির্ভর করে: আপনি উপরেরটি করতে পারেন (সবকিছুকে পাঠ্যে রূপান্তর করুন), ব্লব এপিআই ইত্যাদি ব্যবহার করতে পারেন যদিও আমি এটিকে অত্যধিক নিরুৎসাহিত করি কারণ কিছু মোবাইল ফোন স্মৃতি থেকে আপনার পুরো খেলাটি সাফ করতে পারে। যার অর্থ আপনাকে যাচাই করতে হবে যে সমস্ত কিছু ঠিক আছে (যদি আপনার কোডটি এখনও মেমরিতে থাকে), যার অর্থ দীর্ঘ সময়ের জন্য লোড হওয়া এবং ব্যবহারকারী ফোনটি ক্র্যাশ করতে পারে। আপনি যদি এই পথে নামতে চান তবে আপনি অবশ্যই লোকালফোরেজ ব্যবহার করে উপকৃত হবেন
  • ইলেক্ট্রন বা এনডাব্লু.জেএস ব্যবহার করে , আপনি একটি ডেস্কটপ অ্যাপ্লিকেশন তৈরি করতে আপনার এইচটিএমএল, সিএসএস এবং জেএস ব্যবহার করতে পারেন। মোবাইল অ্যাপ্লিকেশনগুলিও তৈরি করতে অনুরূপ পদ্ধতি ব্যবহার করা যেতে পারে ( কর্ডোভা বা ফোনগ্যাপের মতো কর্ডোভা নির্ভর কিছু ব্যবহার করে )। আপনি এটি করতে চাইবেন এবং ব্যবহারকারীরা চাইলে পুরো গেমটি ডাউনলোড করার অনুমতি দিন।
  • আপনি যদি এখনও কোনও zipফাইল দিয়ে চালিয়ে যেতে চান তবে জেএসজিপ চেকআউট করুন । আপনি কীভাবে এটি ব্যবহার করতে পারেন সে সম্পর্কে আমার কোনও ধারণা নেই তবে আমি নিশ্চিত যে কেউ একটি ভাল ধারণা নিয়ে আসতে পারে (সম্ভবত আপনার ফাইলটি জিপ করুন এবং তারপরে বাইনারি ডেটাটিকে স্ট্রিংয়ে রূপান্তর করুন এবং এটি এইচটিএমএলে ইনলাইন স্থাপন করুন)।
  • এই অদ্ভুত হ্যাক আপনাকে কোনও ডেটা ব্লক হিসাবে পরিচিত এমন কোনও পাঠ্যগত ডেটা লোড করতে দেয়। এটি কেবলমাত্র অন্য একটি সরঞ্জাম যা আপনি এইচটিএমএল ফাইলে সম্পদ এম্বেড করতে ব্যবহার করতে পারেন।
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.