REASONの紹介 / Introductory talk about REASON

Reasonとは
Reasonが提供するもの
なぜOCamlを選んだのか
Messenger.comの50%はReasonに以降済み
文法：let束縛，型の構文，バリアント，パターンマッチ
JavaScriptとの相互運用
コンパイル出力の例

Transcript

1. ɹɹɹɹɹɹɹɹɹ ͷ঺հ
   Meguro.es #15
   2018.5.22
   tipo159
   

   View Slide

2. Reasonͱ͸
   • Facebook͕2016೥ʹެ։ͨ͠OCamlΛJavaScriptʹࣅͤͨݴޠ
   • Facebook͸OCamlΛJavaScriptʹίϯύΠϧ͢ΔBuckleScriptͷ։ൃΛ
   2012೥͔Βߦͳ͍ͬͯͯɼReasonͷαϙʔτΛ2016೥ʹ௥Ճ
   • Reasonͩͱݕࡧ͠ʹ͍ͨ͘ΊɼReasonMLͱॻ͔ΕΔ͜ͱ΋͋Δ
   • 2018.5.6ʹϦϦʔε͞Εͨ3.1.0͕࠷৽
   • 3FBTPO 3FBTPO3FBDUͱ΋.*5ϥΠηϯε
   2
   

   View Slide

3. Reason͕ఏڙ͢Δ΋ͷ
   • ݫ֨Ͱڧ͍ܕγεςϜ
   • ܕਪ࿦ܕఆٛΛ͠ͳͯ͘΋ίϯύΠϥ͕ܕΛਪ࿦
   • ݈શੑ Soundness
   ίϯύΠϧͰ͖Ε͹ܕ͕ਖ਼͍͜͠ͱΛอূ
   • 5ZQF4DSJQUͷܕγεςϜ͸ɼ+BWB4DSJQUͱͷޓ׵ੑͷͨΊ݈શͰ͸ͳ͍
   • γϯϓϧͰ࣮༻త
   • جຊతʹ͸७ਮɾΠϛϡʔλϒϧɾؔ਺ܕ͕ͩɼ໌ࣔ͢Ε͹෭࡞༻ɾϛϡʔςʔ
   γϣϯɾΦϒδΣΫτΛ࢖༻͢Δ͜ͱ΋Մೳ
   • ੑೳͱαΠζ
   • ReasonͷϏϧυγεςϜbsb͸ΠϯΫϦϝϯλϧϏϧυΛ100msҎԼͰऴྃ͠ɼ
   ੜ੒͞ΕΔίʔυ΋খ͍͞ʢϞδϡϥʔԽ͞ΕͨϥϯλΠϜʹΑΓ࢖༻͠ͳ͍ίʔ
   υΛ࡟আ͢ΔͨΊʣ
   3
   

   View Slide

4. Reason͕ఏڙ͢Δ΋ͷʢଓ͖ʣ
   • ΠϯΫϦϝϯλϧͳֶशͱίʔυͷม׵͕Մೳ
   • JavaScriptΛࠞࡏͤ͞Δ͜ͱ͕Մೳ
   • ΤίγεςϜͱπʔϧ
   • ೚ҙͷΤσΟλʔɼnpmύοέʔδɼόϯυϥ΍ςετϑϨʔϜϫʔΫͳͲ͕࢖
   ༻Մೳ
   4
   

   View Slide

5. ͳͥOCamlΛબΜͩͷ͔
   • ωʔςΟϒίʔυΛੜ੒Մೳ
   • OCamlͷωʔςΟϒίʔυ͸ҰܻϛϦඵͰىಈ
   • কདྷతʹ͸ReasonΛωʔςΟϒίʔυͰಈ࡞͍ͤͨ͞
   • ෭࡞༻ɾϛϡʔςʔγϣϯͳͲΛ࢖༻Մೳ
   • طଘͷίʔυΛҠߦ͢ΔͨΊʹ͸ɼ෭࡞༻ͳͲΛαϙʔτ͠ͳ͍ݴޠͰશ໘తʹॻ͖௚͢ΑΓɼ
   ෭࡞༻ͳͲΛαϙʔτ͢ΔݴޠͰগͣͭ͠Ҡߦ͢Δํ͕ݱ࣮త
   • ࣮૷ͷख़੒౓
   • OCaml͸20೥Ҏ্։ൃ͕ߦΘΕɼຖ೥ྑ͘ͳ͍ͬͯΔ
   • ReactΛهड़͢ΔͨΊͷݴޠ
   • Reasonͷ։ൃऀ͸ReactJSͷ։ൃ΋͓ͯ͠ΓɼReactJSͷ࠷ॳͷϓϩτλΠϓ͸ελϯμʔυ
   .-Ͱهड़
   • 2017೥ʹReactJS͸͸ReasonͰ΋هड़ՄೳʢReasonReactʣʹͳͬͨ
   5
   

   View Slide

6. Messenger.comͷ50%͸ReasonʹҠߦࡁΈ
   • 2017.9.8ͷϒϩάهࣄ
   https://reasonml.github.io/blog/2017/09/08/messenger-50-reason.html
   • Facebook MessengerͷWeb൛͕Messenger.comɼfacebook.comͷΠϯϘοΫεϏϡʔͱ
   νϟοτλϒͰίʔυΛڞ༗
   • ̍೥Ҏ্͔͚ͯ50%ͷҠߦΛ࣮ࢪ
   • ౷ܭ৘ใ
   • Reason෦෼ʢ਺ඦϑΝΠϧʣͷϑϧϏϧυ͕2ඵҎԼɼΠϯΫϦϝϯλϧϏϧυ͸ฏۉ
   100msҎԼ
   • Ҏલ͸ຖ೔όάϨϙʔτ͕ૹΒΕ͖͕ͯͨɼ3FBTPOʹҠߦͨ͠෦෼ͷόά͸̍೥ؒͰ݅
   • ΄ͱΜͲͷ.FTTFOHFSίΞ։ൃνʔϜ͸ɼ৽نػೳΛ3FBTPOͰ։ൃ
   • 3FBTPO3FBDUΛಋೖͨ͠਺ेճͷϦϑΝΫλϦϯάʹΑΓɼϦϑΝΫλϦϯάͷεϐʔυ
   ͸਺೔͔ΒᏐे෼ʹ·Ͱ୹ॖ
   6
   

   View Slide

7. จ๏ɿletଋറ
   • MFUଋറ
   w ม਺એݴ୅ೖͰ͸ͳ͘ɼMFUͰ஋Λ໊લʹଋറ
   • ϒϩοΫείʔϓ
   • ଋറ͸\^ͷείʔϓ಺Ͱ༗ޮ
   if (displayGreeting) {
   let message = “Enjoying the docs so far?”;
   print_endline(message)
   };
   /* `message`͸͜͜Ͱ͸ΞΫηεෆՄೳ
   w ଋറ͸Πϛϡʔλϒϧ
   • Ұ౓஋ʹଋറͨ͠Βɼଞͷ஋Λࢀর͢Δ͜ͱ͸Ͱ͖ͳ͍
   • ಉ໊͡લͰ৽͍͠ଋറΛߦ͏ͱݹ͍ଋറ͸γϟυ΢͞ΕΔʢࢀরͰ͖ͳ͘ͳΔʣ
   let message = “hello”;
   print_endline(message); /* “hello”ΛϓϦϯτ */
   let message = “bye”;
   print_endline(message); /* “bye”ΛϓϦϯτ */
   7
   

   View Slide

8. จ๏ɿܕͷߏจ
   • Ξϊςʔγϣϯʢ஫ऍʣ
   ܕਪ࿦Λߦ͏ͨΊɼܕͷهड़͸͠ͳͯ͘΋Α͍
   let score = 10;
   let score: int = 10
   let add = (x: int, y: int) : int => x + y;
   • ΤΠϦΞεʢผ໊ʣ
   • ܕʹผͷ໊લΛ෇͚Δ͜ͱ͕Մೳ
   type scoreType = int;
   let x: scoreType = 10;
   w ܕਪ࿦ʹؔ͢Δิ଍৘ใ
   w VSCodeͷίʔυϖϯͳͲͷΤσΟλػೳͰɼશͯͷίʔυͷܕΛදࣔՄೳ
   8
   

   View Slide

9. จ๏ɿόϦΞϯτ
   • Ϩίʔυ͸ෳ਺ͷσʔλΛ·ͱΊΔ͕ɼόϦΞϯτ͸ෳ਺ͷσʔ
   λͷͲΕ͔Λදݱ
   type myResponseVariant =
   | Yes
   | No
   | PrettyMuch;
   let areYouCrushingIt = Yes;
   9
   

   View Slide

10. จ๏ɿύλʔϯϚον
    • 3FBTPOͷϕετػೳͷҰͭ
    • ෼ׂ୅ೖʢEFTUSVDUVSJOHʣʹࣅ͍ͯΔ͕ɼܕʹج͍͍ͮͯΔ
    let message =
    switch (areYouCrushingIt) {
    | No => “No worries. Keep going!”
    | Yes => “Great!”
    | PrettyMuch => “Nice!”
    };
    10
    

    View Slide

11. JavaScriptͱͷ૬ޓӡ༻
    • ReasonίʔυʹJavaScriptͷίʔυΛຒΊࠐΉ
    Js.log(“this is reason”);
    [%bs.raw {| console.log(‘here is some javascript for you’)
    |}];
    ҎԼʹίϯύΠϧ͞ΕΔ
    ‘use strict’;
    console.log(“this is reason”);
    console.log(‘here is some javascript for you’);
    • JavaScriptͷ஋ΛReason͔ΒΞΫηε
    let x: string = [%bs.raw {| ‘something’ |}];
    ҎԼʹίϯύΠϧ͞ΕΔ
    var x = ( ‘something’ );
    11
    

    View Slide

12. JavaScriptͱͷ૬ޓӡ༻ʢଓ͖ʣ
    • طଘͷJavaScriptΛ࢖༻͢Δ
    bs.moduleΛ࢖༻ͯ͠Πϯϙʔτ͢Δ
    [@bs.module “path”] external dirname : string => string =
    “dirname”;
    let root = dirname(“/User/chenglou”);
    ҎԼʹίϯύΠϧ͞ΕΔ
    var Path = require(“path”);
    var root = Path.dirname(“/User/chenglou”);
    12
    

    View Slide

13. ίϯύΠϧग़ྗͷྫʢೖྗʣ
    type schoolPerson = Teacher | Director | Student(string);
    let greeting = stranger =>
    switch (stranger) {
    | Teacher => "Hey professor!"
    | Director => "Hello director."
    | Student("Richard") => "Still here Ricky?"
    | Student(anyOtherName) => "Hey, " ++ anyOtherName ++ "."
    };
    Js.log(greeting(Student("Richard")));
    13
    

    View Slide

14. ίϯύΠϧग़ྗͷྫʢग़ྗʣ
    // Generated by BUCKLESCRIPT VERSION 3.1.0, PLEASE EDIT WITH CARE
    'use strict';
    function greeting(stranger) {
    if (typeof stranger === "number") {
    if (stranger !== 0) {
    return "Hello director.";
    } else {
    return "Hey professor!";
    }
    } else {
    var anyOtherName = stranger[0];
    if (anyOtherName === "Richard") {
    return "Still here Ricky?";
    } else {
    return "Hey, " + (anyOtherName + ".");
    }
    }
    }
    console.log(greeting(/* Student */["Richard"]));
    exports.greeting = greeting;
    /* Not a pure module */
    14
    

    View Slide