portaldacalheta.pt
  • หลัก
  • การจัดการวิศวกรรม
  • บุคลากรและทีมงานของผลิตภัณฑ์
  • อื่น ๆ
  • นวัตกรรม
แบ็คเอนด์

ความต้องการความเร็ว: ApeeScape JavaScript Coding Challenge Retrospective



ApeeScape เริ่มต้นความท้าทายในการเข้ารหัส JavaScript เว็บแอป เป็นวิธีดึงดูดผู้คนมาที่บูธประชุมของเรา เมื่อเห็นว่าประสบความสำเร็จมากเพียงใดเราจึงตัดสินใจที่จะนำร่องบนเว็บโดยเปิดให้ทุกคนในชุมชนและเครือข่ายของพวกเขา

ภาพหน้าจอของ ApeeScape



ในช่วงเปิดตัวเราได้สนับสนุนให้นักพัฒนาที่มีแรงบันดาลใจคิดหาวิธีที่สร้างสรรค์เพื่อให้ได้คะแนนสูงสุดจากความท้าทายในการเขียนโค้ด JavaScript โดยรวม ปัจจัยแห่งความสำเร็จที่สำคัญบางประการของนักทำงานอิสระอิสระที่เก่งกาจคือความสามารถในการคิดนอกกรอบและค้นหาวิธีสร้างสรรค์ในการทำงานภายใต้ข้อ จำกัด



คำถามท้าทายการเข้ารหัส JavaScript

ถุงมือประกอบด้วยจำนวน JavaScript คำถาม - คล้ายกับคำถามที่อาจใช้เป็น คำถามสัมภาษณ์ - จากคำถามท้าทายพื้นฐานของ JavaScript:



การปรับประสิทธิภาพของฐานข้อมูลและการเพิ่มประสิทธิภาพการสืบค้น
box.double = function double (x) { //return x doubled };

... ไปยังคนระดับกลางมากขึ้น:

box.dateRank = function dateRank (x) { // x is a date in 2019 as string (example: '06/30/2019') // return the rank of the day in 2019 (i.e., '09/01/2019' translates to 244) };

เราต้องการให้ทั้งผู้เริ่มต้นและผู้พัฒนาขั้นสูงได้สนุกและเชิญเพื่อนและเพื่อนร่วมงานมาแข่งขันกับพวกเขาเพื่อให้ได้คะแนนสูงสุด คำถามถูกจัดเรียงตามคะแนนเพื่อให้แม้แต่นักพัฒนารุ่นเยาว์ก็สามารถทำคะแนนได้ ลำดับสำหรับคำถามที่มีคะแนนเท่ากันเป็นแบบสุ่มดังนั้นประสบการณ์จึงแตกต่างกันเล็กน้อยทุกครั้งในขณะที่คำถามทั้งชุดยังคงเหมือนเดิมตลอดทั้งสัปดาห์



เป้าหมายคือการทำงานให้เสร็จสิ้นให้ได้มากที่สุดภายในเวลาที่กำหนดสามนาที ในกรณีที่มีคนพบวิธีที่จะทำงานทั้งหมดให้เสร็จสมบูรณ์ในความท้าทายในการเขียนโค้ด JavaScript จะได้รับ 10 คะแนนสำหรับแต่ละวินาทีที่เหลืออยู่ เราอนุญาตให้มีความพยายามหลายครั้งในการตอบสนองความท้าทาย

สิ่งแรกที่เราคาดว่าจะเกิดขึ้นคือผู้คนจะใช้เวลาพอสมควร ไขข้อข้องใจ ตามสบายจากนั้นคัดลอกและวางคำตอบลงในเว็บแอปพลิเคชัน



หลังจากเริ่มการท้าทายหนึ่งชั่วโมง 40 นาทีบุคคลแรกปฏิบัติตามแนวทางนี้และได้รับคะแนนสูงสุด 1445 คะแนนที่แอปพลิเคชันอนุญาตรวมทั้งคะแนนพิเศษบางส่วนที่เรามอบให้สำหรับทุก ๆ วินาทีที่เหลือ

จุดเปลี่ยนในการเข้ารหัส JavaScript Challenge

ด้วยวิธีการคัดลอกและวางผู้เข้าแข่งขันชั้นนำไม่มีอะไรที่จะได้รับจากการมุ่งเน้นไปที่การเข้ารหัสคำตอบด้วยตนเอง แต่พวกเขากลับให้ความสนใจในการนำความเร็วมาสู่ทักษะการทำงานอัตโนมัติ



วิธีที่ง่ายที่สุดในตอนนี้คือการเขียน JavaScript ที่จะแก้ปัญหาแต่ละงานในขณะที่รอวนซ้ำจนกว่าปุ่มต่างๆจะพร้อมและคัดลอกวางลงในคอนโซลเบราว์เซอร์:

const solutions = { 'double': 'return x*2', 'numberToString': '...', 'square': '...', 'floatToInt': '...', 'isEven': '...', 'squareroot': '...', 'removeFirstFive': '...', // ... 'dateRank': '...', // ... }; const get_submit_button = () => document.querySelector('.task-buttons > .col > .btn'); const solve = () => { const ace_editor = ace.edit(document.querySelector('.ace_editor')) const submission = ace_editor.getValue() for (const key in solutions) { if (submission.includes('box.' + key + ' ')) { ace_editor.insert(solutions[key]) get_submit_button().click() setTimeout(() => { get_submit_button().click() setTimeout(() => { solve() }, 400) }, 900) return } } } solve()

ส่วนนี้สามารถทำได้โดยอัตโนมัติโดยใช้เครื่องมืออัตโนมัติทั่วไปเช่น ซีลีเนียม . แต่วิธีที่เร็วกว่าคือการใช้ API โดยอัตโนมัติโดยส่งโซลูชันไปยังงาน:



const request = require('request'); const runTask = (data, entryId, callback) => { const tests = data.nextTask.tests_json; const results = Object.fromEntries( Object.entries(tests).map(([key, value]) => [key, value.result]) ); request.post(`https://speedcoding.toptal.com/webappApi/entry/${entryId}/attemptTask`, { form: { attempt_id: data.attemptId, tests_json: JSON.stringify(results), }, }, (error, res, body) => { if (error) throw error; const next = JSON.parse(body).data if (next.isChallengeEntryFinished) { callback(next) return } runTask(next, entryId, callback) }); } const runEntry = (callback) => { request.post('https://speedcoding.toptal.com/webappApi/entry', { form: { challengeSlug: 'toptal-speedcoding', email: ..., leaderboardName: ..., isConfirmedToBeContacted: ..., dateStop: ... }, }, (error, res, body) => { if (error) throw error; const { data } = JSON.parse(body); const entryId = data.entry.id runTask(data, entryId, callback) }); } runEntry(console.log)

สิ่งหนึ่งที่ควรทราบก็คือในเวอร์ชันของการทดสอบการเข้ารหัสความเร็วรุ่นนี้โค้ดได้รับการทดสอบเฉพาะในฝั่งไคลเอ็นต์เท่านั้น ด้วยเหตุนี้จึงเป็นไปได้ที่จะส่งคำตอบไปยังกรณีทดสอบแทนรหัส สิ่งนี้ได้รับอนุญาตสำหรับการเพิ่มประสิทธิภาพและตัดส่วนมิลลิวินาทีในฝั่งไคลเอ็นต์

หลังจากผ่านไปสามวันการแข่งขันก็เริ่มร้อนแรงขึ้นโดยจำนวนครั้งต่อถังสามชั่วโมงจะเพิ่มขึ้นจากต่ำกว่า 1,000 เป็นเกือบ 100,000 ครั้ง



สามวันคะแนนยังคงเท่าเดิม บางคนกำลังเขียนการเพิ่มประสิทธิภาพขนาดเล็กสำหรับโค้ดของพวกเขาและหลายคนกำลังส่งโซลูชันของพวกเขาแบบวนซ้ำโดยหวังว่าเซิร์ฟเวอร์จะแออัดน้อยลงเพื่อที่พวกเขาจะได้รับคะแนนน้อยกว่า เรามีกำหนดเซอร์ไพรส์ครั้งใหญ่

ทำลายคะแนนสูงสุดของ JavaScript Coding Challenge

ก่อนอื่นมาทำคณิตศาสตร์สั้น ๆ กันก่อน: เราได้รับคะแนนทั้งหมด 1445 คะแนนสำหรับการทำงานทั้งหมดให้เสร็จและเผื่อเวลาไว้ 180 วินาที หากเราให้คะแนน 10 คะแนนต่อวินาทีในแอปพลิเคชันคะแนนสูงสุดที่ทำได้ตามทฤษฎีจะเป็น 3245 ในกรณีที่ส่งคำตอบทั้งหมดทันที

ผู้ใช้รายหนึ่งของเราได้รับคะแนนมากกว่า 6,000 คะแนนซึ่งเพิ่มขึ้นเรื่อย ๆ เมื่อเวลาผ่านไป

คนที่ได้คะแนนสูงเช่นนี้ได้อย่างไร?

หลังจากตรวจสอบสั้น ๆ เราพบว่าเกิดอะไรขึ้น ผู้เข้าแข่งขันชั้นนำของเราซึ่งเป็นนักพัฒนาฟูลสแต็กมืออาชีพและ ApeeScapeer ที่มีประสบการณ์การเขียนโปรแกรมแข่งขันมากกว่า 15 ปีพบช่องโหว่ในการตั้งค่าความท้าทายในการเขียนโค้ด เขาสร้างบอทหลายตัวซึ่งทำให้เซิร์ฟเวอร์ทำงานช้าลง ในขณะเดียวกันเขาสามารถทำงานเดียวกันให้เสร็จ (งานที่ได้รับคะแนนมากที่สุด) กี่ครั้งก็ได้และกำหนดคะแนนให้กับรายการเดียวโดยเพิ่มคะแนนของรายการนั้นอย่างต่อเนื่อง

สิ่งนี้ไม่ผิดกฎเนื่องจากเราอนุญาตให้ใช้โซลูชันที่สร้างสรรค์ อย่างไรก็ตามวิธีการเฉพาะที่เขาใช้ทำให้เซิร์ฟเวอร์ยุ่งมากทำให้คำขอเครือข่ายช้าลงสำหรับคนอื่น ๆ สิ่งแรกที่เราทำคือเพิ่มพลังเซิร์ฟเวอร์ของเราซึ่งทำให้เขาไปจาก 56,000 เป็น 70,000 คะแนนและอยู่ในอันดับแรก

แม้ว่าเราจะไม่ต้องการแทรกแซงวิธีที่ผู้คนโต้ตอบกับความท้าทาย แต่ความพยายามเหล่านี้ก็ทำให้เซิร์ฟเวอร์ช้าลงเท่าที่ความท้าทายนั้นยากที่จะใช้กับผู้ใช้รายอื่นดังนั้นเราจึงตัดสินใจที่จะแก้ไขช่องโหว่

การแก้ไขนี้ทำให้ผู้อื่นไม่สามารถทำคะแนนได้เท่ากันในวันสุดท้ายของความท้าทายในการเขียนโค้ด JavaScript ด้วยเหตุนี้เราจึงตัดสินใจขยายจำนวนรางวัลที่มอบให้กับผู้เข้าแข่งขันชั้นนำ ในขั้นต้นรางวัลสูงสุดซึ่งเป็น AirPods คู่หนึ่งควรตกเป็นของผู้เข้าแข่งขันอันดับหนึ่งเท่านั้น ในท้ายที่สุด AirPods จะถูกมอบให้กับผู้ที่ถือครองตำแหน่งหกอันดับแรก

จุดเริ่มต้นที่ต่ำต้อยและจุดจบที่ดุร้าย: สถิติความท้าทายในการเข้ารหัส JavaScript บางอย่าง

แม้แต่ผู้ทำประตูสูงสุดของเราก็มีปัญหาในการเริ่มต้น ในความเป็นจริงจากทุกคนที่พยายามทำ 5 ครั้งขึ้นไปคะแนนสูงสุดสำหรับการพยายามครั้งแรกของทุกคนคือ 645 คะแนนและค่ามัธยฐานสำหรับการพยายามครั้งแรกในกลุ่มนั้นมีเพียง 25 คะแนน

ในตอนท้ายของการแข่งขันเราสามารถเดากลยุทธ์ที่กำลังพยายามได้จากจำนวนครั้งทั้งหมด ในขณะที่บางคนมีประสิทธิภาพมากกว่าคนอื่น ๆ แต่ผู้เข้าแข่งขันอันดับต้น ๆ ที่อยู่ห่างไกลและมีจำนวนความพยายามสูงสุด

กราฟแท่งลอการิทึมแบบรวมที่แสดงผู้เข้าแข่งขัน 20 อันดับแรก

ก้าวไปข้างหน้า

อนาคตจะเป็นอย่างไร?

นี่เป็นเพียงการทำซ้ำความท้าทายการเข้ารหัส JS ครั้งแรก เราต้องการสร้างความท้าทายในการเขียนโปรแกรม JavaScript อีกมากมายในอนาคตเรียนรู้ บทเรียน จากการวิ่งครั้งก่อนและทำให้น่าตื่นเต้นยิ่งขึ้น สิ่งแรกที่เราต้องทำคือการพยายามควบคุมปริมาณเพื่อ จำกัด จำนวนการส่ง นอกจากนี้เรายังต้องการขยายนอกเหนือจากความท้าทายในการเขียนโค้ดใน JavaScript ทำให้สามารถใช้งานได้ในภาษาโปรแกรมที่หลากหลาย

สุดท้ายนี้ในขณะที่เราใช้มาตรการเพื่อทำให้ความท้าทายในการเข้ารหัส JavaScript ปลอดภัยยิ่งขึ้นเราวางแผนที่จะอนุญาตให้ใช้บอทและแนวทางสร้างสรรค์อื่น ๆ ต่อไปสำหรับความท้าทายในอนาคต


ขอขอบคุณเป็นพิเศษ Pavel Vydra , Anton Andriievskyi , ติอาโกชิแลนติ และ Matei Copot สำหรับการมีส่วนร่วมของพวกเขาต่อความท้าทายและบทความนี้และถึง @Zirak สำหรับ โครงการโอเพ่นซอร์ส ที่เป็นพื้นฐานของแอปการแข่งขัน ในทำนองเดียวกันขอบคุณทุกคนที่เข้าร่วมและวิ่ง - การแข่งขัน

ทำความเข้าใจพื้นฐาน

ฉันจะฝึกความท้าทายในการเขียนโค้ดได้อย่างไร

ในการเป็นผู้เชี่ยวชาญในการแก้ปัญหาการเขียนโค้ดคุณควรปรับปรุงอย่างต่อเนื่องโดยเลือกปัญหาที่ยากขึ้นเรื่อย ๆ ความท้าทาย JavaScript ของ ApeeScape มีระดับความยากของงานที่หลากหลาย อย่าข้ามปัญหาที่ดูน่าเบื่อ: วิธีเดียวที่จะปรับปรุงคือการมุ่งเน้นไปที่การแก้ไขปัญหาเหล่านี้ด้วย

ความท้าทายของ JavaScript คืออะไร?

ความท้าทายของ JavaScript ออกแบบมาเพื่อทดสอบความรู้ด้านการเขียนโปรแกรมของคุณในสภาพแวดล้อมที่กำหนดเวลา คุณควรจะสามารถเลือกโครงสร้างข้อมูลและออกแบบอัลกอริทึมได้อย่างชาญฉลาดอย่างรวดเร็ว

ฉันจะฝึกเขียนโค้ด JavaScript ได้ที่ไหน

แบบฝึกหัด, Codewars, Codility และความท้าทายในการเข้ารหัสความเร็วของ ApeeScape (เมื่อมี) เป็นสถานที่ที่ยอดเยี่ยมในการฝึกฝนการเขียนโค้ด JavaScript ไม่ว่าจะเป็นการแข่งขันหรืออื่น ๆ

กำลังพัฒนาระบบ Infotainment ในรถยนต์เช่น Android Auto และ Apple Carplay เป็นสิ่งที่ยิ่งใหญ่ต่อไปหรือไม่?

มือถือ

กำลังพัฒนาระบบ Infotainment ในรถยนต์เช่น Android Auto และ Apple Carplay เป็นสิ่งที่ยิ่งใหญ่ต่อไปหรือไม่?
บทที่ 11 การล้มละลาย: มันคืออะไรและจะเกิดอะไรขึ้นต่อไป?

บทที่ 11 การล้มละลาย: มันคืออะไรและจะเกิดอะไรขึ้นต่อไป?

กระบวนการทางการเงิน

โพสต์ยอดนิยม
แหล่งข้อมูลสำหรับธุรกิจขนาดเล็กสำหรับ COVID-19: เงินกู้เงินช่วยเหลือและสินเชื่อ
แหล่งข้อมูลสำหรับธุรกิจขนาดเล็กสำหรับ COVID-19: เงินกู้เงินช่วยเหลือและสินเชื่อ
วิธีออกแบบประสบการณ์ที่ยอดเยี่ยมสำหรับอินเทอร์เน็ตในทุกสิ่ง
วิธีออกแบบประสบการณ์ที่ยอดเยี่ยมสำหรับอินเทอร์เน็ตในทุกสิ่ง
กลยุทธ์การสื่อสารที่มีประสิทธิภาพสำหรับนักออกแบบ
กลยุทธ์การสื่อสารที่มีประสิทธิภาพสำหรับนักออกแบบ
เรียนรู้ Markdown: เครื่องมือการเขียนสำหรับนักพัฒนาซอฟต์แวร์
เรียนรู้ Markdown: เครื่องมือการเขียนสำหรับนักพัฒนาซอฟต์แวร์
แนวโน้มต่อไปนี้: การแสดงความเคารพกับการลอกเลียนแบบการออกแบบ
แนวโน้มต่อไปนี้: การแสดงความเคารพกับการลอกเลียนแบบการออกแบบ
 
คู่มือสไตล์ Sass: บทช่วยสอน Sass เกี่ยวกับวิธีการเขียนโค้ด CSS ที่ดีขึ้น
คู่มือสไตล์ Sass: บทช่วยสอน Sass เกี่ยวกับวิธีการเขียนโค้ด CSS ที่ดีขึ้น
ทำลายกระบวนการคิดเชิงออกแบบ
ทำลายกระบวนการคิดเชิงออกแบบ
การออกแบบเว็บไซต์ CMS: คู่มือการใช้งานเนื้อหาแบบไดนามิก
การออกแบบเว็บไซต์ CMS: คู่มือการใช้งานเนื้อหาแบบไดนามิก
ทำคณิตศาสตร์: การปรับขนาดแอปพลิเคชันไมโครเซอร์วิสด้วย Orchestrators
ทำคณิตศาสตร์: การปรับขนาดแอปพลิเคชันไมโครเซอร์วิสด้วย Orchestrators
การปฏิวัติหุ่นยนต์เชิงพาณิชย์ที่กำลังจะเกิดขึ้น
การปฏิวัติหุ่นยนต์เชิงพาณิชย์ที่กำลังจะเกิดขึ้น
โพสต์ยอดนิยม
  • การขุดข้อมูล twitter ด้วย python
  • การออกแบบหมายถึงอะไรในงานศิลปะ
  • การออกแบบกราฟิก vs วิจิตรศิลป์
  • วิธีทำกราฟิก 3 มิติ
  • ข้อใดต่อไปนี้เป็นขั้นตอนในการบริหารความเสี่ยงจากอัตราแลกเปลี่ยน
หมวดหมู่
  • การจัดการวิศวกรรม
  • บุคลากรและทีมงานของผลิตภัณฑ์
  • อื่น ๆ
  • นวัตกรรม
  • © 2022 | สงวนลิขสิทธิ์

    portaldacalheta.pt