প্রোপটাইপগুলি বনাম প্রবাহের প্রতিক্রিয়া জানান


102

প্রোপটাইপস এবং ফ্লো একই ধরণের জিনিসগুলি কভার করে তবে বিভিন্ন পদ্ধতির ব্যবহার করে। প্রোপটাইপস আপনাকে রানটাইম চলাকালীন সতর্কবার্তা দিতে পারে যা সার্ভার থেকে আসা ত্রুটিযুক্ত প্রতিক্রিয়াগুলি দ্রুত খুঁজে পেতে সহায়ক হতে পারে ইত্যাদি However এছাড়াও নিউক্লাইড দ্বারা প্রদত্ত স্বতঃপূরণ প্রবাহের জন্য একটি বড় প্লাস।

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

export const PlaylistPropType = PropTypes.shape({
    next: ItemPropTypes,
    current: ItemPropTypes,
    history: PropTypes.arrayOf(ItemPropTypes).isRequired
});

export type Playlist = {
    next: Item,
    current: Item,
    history: Array<Item>
};

উভয় সংজ্ঞা মূলত একই তথ্য ধারণ করে এবং যখন ডেটা টাইপ পরিবর্তন করা হয়, উভয় সংজ্ঞা আপডেট করা প্রয়োজন।

আমি প্রকারের টাইপ ডিক্লেয়ারেশনগুলিকে প্রোপটাইপসে রূপান্তর করতে এই ব্যাবেল প্লাগইনটি পেয়েছি, এটি সমাধান হতে পারে।


4
আপনি যদি ফ্লো দিয়ে শুরু করতে চান তবে এই পোস্টটি ব্যবহার করে দেখুন: রবিনউইচ.ওড়
ইন- রিরেট-

4
অভিজ্ঞতা থেকে, প্রশ্নের মধ্যে উল্লিখিত প্লাগইন ব্যবহার করা খুব ভাল ধারণা নয়। এটি সমস্ত ধরণের উপাদান সমর্থন করে না, v0.39 হিসাবে সম্পূর্ণরূপে রিএ্যাক্ট নেটিভ দিয়ে ভেঙে গেছে এবং সাধারণত খুব ভঙ্গুর হয়। রেপোর মালিক এই বিষয়গুলির বিষয়ে মোটামুটি দ্রুত প্রতিক্রিয়া জানাতেন, তবে মনে হয় তিনি আগ্রহ হারিয়ে ফেলেছেন এবং এটি বজায় রাখার জন্য আর নির্ভর করা যায় না।
টমটি

প্রবাহ এবং tcomb ব্যবহার করে স্থির এবং রানটাইম টাইপ পরীক্ষার জন্য বাবেল প্লাগইনের মাধ্যমে টকম্ব চেষ্টা করুন ।
comerc

উত্তর:


82

এই প্রশ্নটি জিজ্ঞাসার এক বছর পরে, আমি কীভাবে এই সমস্যাটির সাথে আমার অভিজ্ঞতাগুলি সম্পর্কে একটি আপডেট দিতে চেয়েছিলাম।

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

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


আপনি কোন আইডিই ব্যবহার করেন? ওয়েবস্টর্ম?
sergey.tyan

4
আমি আদর্শ-প্রবাহরূপ প্লাগইন সহ অ্যাটম ব্যবহার করছি।
ড্যানিয়েলবুচেল

আপনি যদি এখনও যখন childContextTypes ব্যবহার propTypes প্রয়োজন - stackoverflow.com/questions/42395113/...
শ্যাম

4
নতুন প্রসঙ্গ API এর কারণে শিশু প্রসঙ্গগুলি পরিচালনা করতে গিয়ে এখন প্রপটিপগুলি ব্যবহার করার দরকার নেই: reactjs.org/docs/context.html
স্টিভবি

36

উভয়ই প্রকারের চেক করার খুব বিস্তৃত ক্ষেত্রের সাথে সম্পর্কিত, দুজনের মধ্যে সত্যিকারের তেমন মিল নেই।

ফ্লো হ'ল স্থিতিশীল বিশ্লেষণ সরঞ্জাম যা আপনাকে আপনার কোডে সমস্ত ধরণের টিকা যুক্ত করতে এবং সংকলনের সময় পুরো ক্লাসের বাগগুলি ধরতে দেয় language

প্রোপটাইপস একটি প্রাথমিক ধরণের পরীক্ষক যা প্রতিক্রিয়াতে প্যাচ করা হয়েছে। এটি কোনও প্রদত্ত উপাদানগুলিতে প্রপসগুলি প্রেরণ করা হচ্ছে তা ছাড়া অন্য কিছু পরীক্ষা করতে পারে না।

আপনি যদি আপনার পুরো প্রকল্পের জন্য আরও নমনীয় টাইপচেকিং চান তবে ফ্লো / টাইপস্ক্রিপ্ট উপযুক্ত পছন্দ। এতক্ষণ আপনি কেবল টীকায়িত প্রকারগুলি উপাদানগুলিতেই চলে যাচ্ছেন, আপনার প্রোপটাইপগুলির প্রয়োজন হবে না।

আপনি যদি প্রপ প্রকারগুলি যাচাই করতে চান তবে আপনার বাকী কোডবেসকে অতিরিক্ত জটিল করে তুলবেন না এবং সহজ বিকল্পটি নিয়ে যাবেন না।


12
হ্যাঁ, তারা কীভাবে কাজ করে সে ক্ষেত্রে তারা খুব আলাদা। তবে এগুলি ব্যবহারের উদ্দেশ্যটি খুব মিল, আমার ধারণা। তবে আপনি যে বিষয়টির দিকে লক্ষ্য করেছেন সেটি একটি ভাল বিষয়: প্রবাহটি আপনাকে আপনার কোডবেইসের আরও বেশি কিছু কভার করুন, যেখানে প্রোপটাইপগুলি ব্যবহার করার সময় আপনি প্রপসগুলিতে সীমাবদ্ধ।
ড্যানিয়েলবুয়েলে

4
ব্যবহারের উদ্দেশ্যটি কেবলমাত্র একই রকম যদি আপনি প্রপ প্রকারগুলি পরীক্ষা করতে শুধুমাত্র ফ্লো ব্যবহার করেন। একটি মূলত একটি ভাষা, অন্যটি সবেমাত্র একটি গ্রন্থাগার।
ড্যান প্রিন্স

সম্পূর্ণরূপে @ ড্যানপ্রিন্সের সাথে একমত হন। এবং প্রোপটাইপস সহ সার্ভার থেকে ত্রুটিযুক্ত প্রতিক্রিয়াগুলি পরীক্ষা করা ভাল ধারণা বলে আমি মনে করি না। এটির পক্ষে যদি ম্যানুয়াল চেক থাকে এবং আপনার ইউআই সঠিকভাবে প্রতিক্রিয়া জানায় (কনসোলে কোনও সতর্কতা বার্তা না দিয়ে) উদাহরণস্বরূপ একটি সতর্কতা বার্তা প্রদর্শন করে)।
ইয়ান টাকুশেভিচ

7
পছন্দ করুন প্রোপটাইপগুলি যাইহোক উত্পাদনের সময় অক্ষম করা উচিত, সুতরাং আপনার ব্যবহারকারীদের একটি ভাল অভিজ্ঞতা আছে তা নিশ্চিত করার জন্য আপনার সর্বদা ম্যানুয়াল চেক প্রয়োজন। তবে প্রোপটাইপগুলি বিকাশের সময় রানটাইম সতর্কতার জন্য খুব কার্যকর হতে পারে। আপনি কিছু ভুলে যাবেন না তা নিশ্চিত করার জন্য এটি একটি দুর্দান্ত সুরক্ষা জাল।
ndbroadbent

29

আমি বিশ্বাস করি এখানে বিন্দু মিস করে ফ্লো একটি হল স্ট্যাটিক পরীক্ষক যখন PropTypes একটি হল রানটাইম পরীক্ষক , যার মানে

  • প্রবাহ কোডিংয়ের সময় ত্রুটিগুলি উজানে আটকাতে পারে: এটি তাত্ত্বিকভাবে এমন কিছু ত্রুটিগুলি মিস করতে পারে যা আপনি জানেন না (উদাহরণস্বরূপ, আপনি যদি আপনার প্রকল্পে যথেষ্ট প্রবাহ বাস্তবায়ন না করেন, বা গভীর নেস্টেড বস্তুর ক্ষেত্রে)
  • প্রোপটাইপগুলি পরীক্ষার সময় সেগুলি প্রবাহিত করবে, সুতরাং এটি কখনও মিস করবে না

4
এখানে ইতিমধ্যে একটি উত্সর্গীকৃত বাবেল
এমএনকেজিজি

16

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

এখন একটি ভুল ধরণের সাথে প্রতিক্রিয়া প্রপাইপ ব্যবহার করুন। এই অ্যাপ্লিকেশনটি চালিত হওয়ার পরে এটি পরীক্ষাগুলি ব্যর্থ হতে পারে এবং ব্রাউজার কনসোলে পতাকাঙ্কিত হয়।

এর উপর ভিত্তি করে, এটি মনে হয় যে ফ্লো ব্যবহৃত হচ্ছে এমন কি, প্রপটাইপগুলিও নির্দিষ্ট করা উচিত।


এটি টেস্টগুলি কীভাবে করা হয় তার উপর নির্ভর করে, যদি আপনি ঠাট্টার স্ন্যাপশট পরীক্ষা ব্যবহার করেন, পরীক্ষাগুলি অবৈধ সম্পত্তি মানগুলির সাথে ব্যর্থ হবে।
আলেকজান্দ্রে বোরেলা

4
আপনার আইডিইতে ত্রুটির সুবিধাটি হ'ল আপনি পরীক্ষা চালানোর আগেই তা অবিলম্বে এটি দেখতে পান ।
টম ফেনেক

বেল্ট এবং স্থগিতকারীদের পদ্ধতির জন্য প্লাস 1।
ডেভিড এ। গ্রে
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.