Perlawanan Empat Model Terbaik! Tinjauan Mempamerkan Kehebatan Deepseek R1

Sejak beberapa hari kebelakangan ini, Deepseek-R1 0528 telah menjadi sumber terbuka secara rasmi.

Pada LiveCodeBench, prestasinya hampir setanding dengan o3 OpenAI (tinggi); dalam ujian penanda aras berbilang bahasa Aider, ia bertahan dengan Claude Opus.

Apabila ia dilancarkan di tapak web rasmi, kami segera menguji keupayaan bahagian hadapannya dan mendapati ia sangat kuat, yang membawa kepada ujian yang diliputi dalam artikel ini. Kami berhasrat untuk berkongsi prestasi khusus model yang berbeza dengan anda.

Adalah penting untuk ambil perhatian bahawa ujian ini tertumpu terutamanya pada keupayaan bahagian hadapan, jadi adalah penting untuk melihat prestasi model yang berbeza secara objektif. Anda boleh menggunakan gesaan yang kami sediakan untuk menjalankan ujian anda sendiri dan berkongsi pandangan serta penemuan anda.

Menggunakan gesaan yang sama, kami menghantarnya kepada Claude Opus 4, Sonnet 4, Gemini 2.5 Pro dan DeepSeek R1-0528, dan meminta mereka bersaing dalam enam tugas pembangunan bahagian hadapan yang semakin mencabar.

Bagi mereka yang tidak sabar, inilah kesimpulannya:

Deepseek-R1-0528 sedikit mengekori Opus 4 dalam keupayaan bahagian hadapan tetapi mengatasi prestasi Soneta 4 dan Gemini 2.5 Pro.

Pada asasnya, sebarang tugasan Opus boleh selesaikan, R1 juga boleh selesaikan, malah tugasan Opus 4 tidak dapat diselesaikan, R1 boleh kendalikan, walaupun dengan kadar penyiapan yang lebih rendah dan kualiti hasil.

Memandangkan perbezaan harga antara R1 dan tiga yang lain, prestasi ini sudah sangat baik, dan kita hanya boleh bayangkan betapa mengagumkannya R2.

Ujian 1: Sistem Pengurusan Gudang

Prompt: Tolong bantu saya membuat alat pengurusan produk berasaskan web yang lengkap dengan keperluan berikut:

Keperluan Fungsian

1. Pengurusan Produk

• Kemasukan Maklumat Produk: Nama produk, jenis/kategori, nombor SKU, harga, kuantiti inventori
• Pengurusan imej produk: Sokongan muat naik dan pratonton imej (disimulasikan dengan pemilih fail)
• Paparan senarai produk: Paparkan semua produk dalam format jadual, dengan sokongan carian dan penapis
• Suntingan produk: Menyokong pengubahsuaian maklumat produk
• Pemadaman produk: Menyokong pemadaman produk (dengan gesaan pengesahan)

2. Pengurusan inventori

• Operasi masuk: Meningkatkan kuantiti inventori produk, merekodkan masa dan kuantiti masuk
• Operasi keluar: Kurangkan kuantiti inventori produk, rekod masa dan kuantiti keluar
• Rekod inventori: Memaparkan sejarah perubahan inventori untuk setiap produk

3. Ciri antara muka

• Papan pemuka: Memaparkan statistik seperti jumlah bilangan produk, jumlah nilai inventori, makluman inventori rendah, dsb.
• Reka bentuk responsif: Boleh disesuaikan dengan desktop dan peranti mudah alih
• Kegigihan data: Menggunakan localStorage untuk menyimpan data

Keperluan teknikal

Gaya dan ikon

• rangka kerja CSS: Menggunakan TailwindCSS 3.0+ CDN
• Perpustakaan ikon: Menggunakan CDN Heroicons atau Feather Icons
• fon: Gunakan Fon Google

Struktur Kod

• Aplikasi satu halaman: HTML + CSS + JavaScript
• Reka bentuk modular: Pecahkan fungsi kepada modul JavaScript yang berbeza
• Format data: Gunakan format JSON untuk menyimpan data produk

Keperluan Reka Bentuk Antara Muka

• UI moden: Reka bentuk antara muka yang ringkas dan cantik
• Skema warna: Gunakan kombinasi warna perniagaan profesional
• Maklum balas interaktif: Klik butang, pengesahan borang dan kesan interaktif lain
• Pengesahan borang: Pengesahan medan yang diperlukan, pengesahan format data

Contoh Struktur Data

Sila jana fail HTML lengkap yang mengandungi semua kod CSS dan JavaScript yang diperlukan, memastikan semua ciri berfungsi dan boleh dijalankan terus dalam penyemak imbas.

Mari kita lihat keputusan ujian. Logik sebenarnya agak kompleks, menguji panjang konteks model, rasa estetik dan keupayaan pemprosesan logik.

Dalam kes ini, semua model kecuali Deepseek gagal. Terjemahan Claude 4 agak meleset, sejujurnya.

Deepseek-R1-0528: Versi R1 yang dinaik taraf sangat berkuasa. Seperti yang anda lihat, antara muka adalah sangat profesional, dan anda juga boleh mencipta produk baharu, melaksanakan operasi keluar dan masuk biasa, dan membahagikan laporan produk, pengurusan inventori dan inventori kepada tiga halaman, yang sangat jelas secara keseluruhan. Terdapat juga halaman papan pemuka khusus, dan dia menulis beberapa data sampel untuk ujian. Model lain tidak mempunyai data dan menambah produk tidak berfungsi, jadi ujian adalah mustahil.

Claude Opus 4: Ia bermula dengan antara muka yang besar, sangat mudah, menggunakan bar navigasi atas dan bukannya bar sisi yang biasa dalam platform SaaS. Menambah produk mengakibatkan ralat semasa menyimpan, menjadikan ujian mustahil.

Claude Sonnet 4: Berbanding dengan Opus 4, antara muka adalah lebih asas. Mengklik butang "Tambah Produk" tidak bertindak balas dan tiada borang timbul muncul. Halaman lain pada asasnya hanyalah pemegang tempat.

Gemini 2.5 Pro: Versi Google lebih baik daripada Claude. Ia membenarkan menambah produk dan berjalan, tetapi terdapat pepijat. Ia berkesan apabila saya mula-mula mencubanya, tetapi tidak apabila saya merakam video. Walau bagaimanapun, reka bentuk interaksi Gemini agak rumit, dengan pengurusan inventori dan penyimpanan rekod semuanya dalam satu jadual, yang menambah sedikit kesukaran.

Ujian 2: Editor Animasi Piksel

Seterusnya ialah ujian keupayaan visual. Saya meminta mereka untuk mencipta editor animasi seni piksel menggunakan P5.js, menyokong mod pergerakan, melaraskan bentuk titik, saiz, kelajuan dan keadaan lain.

Gesaan: Buat penjana animasi seni piksel interaktif skrin penuh berdasarkan P5.js, memenuhi keperluan teknikal berikut:

Ciri Teras

• Laksanakan animasi seni piksel skrin penuh menggunakan P5.js, dengan animasi meliputi keseluruhan kawasan port pandangan
• Jumlah kawasan grid piksel mestilah sekurang-kurangnya 10 kali ganda luas yang boleh dilihat untuk memastikan liputan penuh walaupun pada jarak grid terkecil
• Sediakan berbilang mod animasi: Gelombang, Nadi, Riak, Bunyi
• Menyokong pelbagai pilihan bentuk titik: bulatan, persegi, salib, segi tiga, berlian, dsb.
• Semua panel kawalan diletakkan di sebelah kanan halaman dan boleh diruntuhkan ke bahagian bawah pada peranti mudah alih

Parameter Boleh Laras

• Ketumpatan titik: Kawal bilangan titik setiap baris/lajur
• Saiz bentuk: Laraskan saiz titik
• Kelajuan animasi: Kawal kelajuan dan amplitud kesan animasi
• Jarak grid: Laraskan jarak antara titik

Spesifikasi Teknikal

• Gunakan HTML5, TailwindCSS 3.0+ (diperkenalkan melalui CDN) dan P5.js
• Laksanakan fungsi pensuisan mod gelap/cahaya penuh, lalai kepada tetapan sistem
• Kod mesti termasuk logik pengoptimuman prestasi, hanya memaparkan titik dalam kawasan yang boleh dilihat dan berhampiran tepi
• Animasi mesti berjalan lancar tanpa ketinggalan

Reka bentuk responsif

• Halaman mesti dipaparkan dengan sempurna pada semua peranti (mudah alih, tablet, desktop)
• Panel kawalan hendaklah boleh dilipat/boleh dikembangkan dalam paparan mudah alih
• Optimumkan reka letak dan saiz fon untuk saiz skrin yang berbeza
• Pastikan pengalaman sentuhan yang baik pada peranti mudah alih

Elemen Antara Muka

• Pemilih mod animasi (gelombang, nadi, riak, bunyi)
• Pemilih bentuk (memaparkan pelbagai bentuk dengan ikon)
• Kawalan peluncur: ketumpatan, saiz, kelajuan, jarak
• Butang suis tema
• Paparkan maklumat tindanan matriks dan jumlah bilangan mata

Lihatlah hasilnya. Sejujurnya, saya tidak menjangkakan model lain berprestasi begitu teruk dalam ujian ini. Kecuali Deepseek-R1, animasi model lain tidak berfungsi sama sekali.

Deepseek-R1-0528: sempurna sempurna. Setiap butang dan peluncur berfungsi seperti biasa, dan mata bergerak dengan lancar. Ia juga menambahkan data matriks titik, dan warna kekal konsisten selepas bertukar kepada mod malam. Satu-satunya isu kecil ialah keadaan pemilihan warna yang dipilih mempunyai sedikit masalah, tetapi ini boleh diabaikan berbanding dengan prestasi buruk model lain.

Claude Opus 4: Berita baik: ia mempunyai seni piksel. Berita buruk: ia tidak bergerak. Kandungan di sebelah kanan boleh dikendalikan seperti biasa, tetapi skema warna tidak betul selepas bertukar kepada mod malam.

Claude Sonnet 4: Yang ini adalah bencana. Tiada seni piksel, malah keadaan pemilihan butang juga tiada. Gelangsar hanyalah titik—boleh juga menggunakan komponen lalai.

Gemini 2.5 Pro: Juga melaporkan ralat tanpa grid piksel. Kandungan di sebelah kanan boleh dikendalikan seperti biasa, dan penukaran tema berfungsi dengan baik, tetapi komponen lalai agak hodoh.

Ujian 3: Alat pengekstrakan warna kecerunan imej

Ini adalah alat yang saya tulis sebelum ini. Tidak banyak penerangan tentang logik, tetapi terdapat lebih banyak penerangan tentang gaya. Fungsi utama adalah untuk mengekstrak lima set warna kecerunan daripada imej.

Prompt: Jana halaman web HTML berdasarkan kandungan fail berikut, menyokong mengekstrak lima set warna kecerunan daripada imej yang dimuat naik dan membenarkan pengguna menyalin terus lima set warna kecerunan heksadesimal. Fungsi pengekstrakan warna perlu dilaksanakan.

1. Gunakan reka bentuk visual gaya Muzik Awan NetEase, latar belakang putih dengan warna yang serupa dengan #FE1110 sebagai kemuncak
2. Tekankan fon atau nombor yang besar untuk menyerlahkan perkara utama. Sertakan elemen visual bersaiz besar untuk menekankan kawasan fokus, mencipta kontras dengan elemen yang lebih kecil.
3. Campurkan teks Cina dan Inggeris. Gunakan huruf Cina yang tebal dan besar dan teks Inggeris yang lebih kecil sebagai aksen.
4. Gunakan grafik garisan mudah untuk visualisasi data atau sebagai elemen hiasan.
5. Gunakan kecerunan ketelusan warna serlahan untuk mencipta kesan berinspirasikan teknologi, tetapi pastikan warna serlahan yang berbeza tidak bercantum antara satu sama lain.
6. Tiru animasi tapak web rasmi Apple, dengan menatal tetikus mencetuskan animasi
7. Data boleh dirujuk daripada komponen carta dalam talian, dengan gaya yang konsisten dengan tema
8. Gunakan Framer Motion (melalui CDN)
9. Gunakan HTML5, TailwindCSS 3.0+ (melalui CDN), dan JavaScript yang diperlukan
10. Gunakan perpustakaan ikon profesional seperti Font Awesome atau Ikon Bahan (melalui CDN)
11. Elakkan menggunakan emoji sebagai ikon utama
12. Butang kapsul di sudut kiri bawah memaparkan pemegang Twitter pengarang

Dalam kes ini, Claude akhirnya melakukan kerja yang hebat. Butiran halaman dan estetika Deepseek-R1-0528 sangat mengagumkan, tetapi fungsinya tidak dilaksanakan. Halaman Opus 4 dan Sonnet 4 lebih ringkas tetapi sekurang-kurangnya berfungsi, manakala Gemini tidak berfungsi sama sekali.

Deepseek-R1-0528: Selepas menggunakan gesaan saya sekali lagi, estetika halaman Deepseek benar-benar tiada tandingan. Beliau juga menambahkan banyak kandungan mesra SEO pada halaman, seperti senario aplikasi dan masa pemprosesan. Kad paparan berwarna kecerunan juga sangat terperinci, tetapi logik pemilihan warna tidak dilaksanakan.

Claude Opus 4: Kali ini, Claude akhirnya tidak mengecewakan, melengkapkan fungsi halaman, tetapi kandungan halaman adalah sangat asas, dengan hanya tempat untuk memuat naik imej dan hasilnya, dan logik pemilihan warna juga lemah. Walau bagaimanapun, sekurang-kurangnya ia berfungsi.

Claude Sonnet 4: Sonnet 4 juga melengkapkan fungsi, dan saya juga berpendapat keputusan Sonnet lebih baik daripada Opus, walaupun ia masih tidak sekaya Deepseek.

Gemini 2.5 Pro: Yang ini adalah yang paling teruk. Bukan sahaja butiran halaman dan estetika kurang, tetapi fungsinya juga tidak dilaksanakan, dan ia ranap pada permulaan.

Ujian 4: Laman Web Petikan Harian White Noise

Seterusnya ialah penjana laman web petikan harian bunyi putih, yang sesuai untuk pemalam halaman tab baharu. Ia menyokong memainkan bunyi putih daripada Spotify, dan halaman web dipaparkan

Prompt: Tolong bantu saya membuat tapak web sebut harga harian yang ringkas dan elegan dengan keperluan berikut:

Reka Bentuk Visual

• Imej Latar Belakang: Pilih imej landskap berkualiti tinggi secara rawak daripada pautan berikut sebagai imej latar belakang
• Pautan Imej: XXXX
• Pemprosesan Imej: Tambahkan topeng hitam 25% dan kabur Gaussian sedikit untuk memastikan teks kekal jelas dan boleh dibaca
• Gaya Keseluruhan: Minimalis dan moden, dengan imej landskap sebagai latar belakang halaman web untuk meningkatkan rendaman
• Gunakan anime.js (diperkenalkan melalui CDN: JsDelivr jsdelivr.com) untuk rangka kerja animasi, HTML5, TailwindCSS 3.0+ (diperkenalkan melalui CDN), dan JavaScript yang diperlukan, dan gunakan perpustakaan ikon profesional seperti Font Awesome atau Material Icons (diperkenalkan melalui CDN).

Modul paparan masa

• Atas: Paparkan format bulan dan hari (cth, “29 Mei”), dalam fon yang lebih kecil, berpusat
• Baris kedua: Memaparkan format “Minggu X · Kalendar Lunar bulan X bulan X hari” dalam fon yang lebih kecil
• Pusat: Serlahkan tarikh semasa dalam fon putih besar, berpusat

Modul paparan sebut harga

• kandungan: Memaparkan petikan klasik daripada ahli falsafah dan penulis Cina dan asing secara rawak
• Susun atur: Petikan dipusatkan, saiz fon sederhana dan jarak baris selesa
• Atribusi: “Penulis, XXX” atau “Ahli Falsafah, XXX” dipaparkan di bahagian bawah sebelah kanan
• Perpustakaan Sebutharga: Mengandungi petikan tentang pelbagai topik seperti motivasi, pandangan hidup, dan hikmah

Fungsi Main Semula Muzik

• Lokasi: Penjuru kiri bawah halaman, diruntuhkan secara lalai
• kandungan: Benamkan senarai main bunyi putih Spotify
• Kod:

Pelaksanaan Teknikal

• Reka Bentuk Responsif: Disesuaikan untuk desktop dan peranti mudah alih
• Pemilihan Fon: Gunakan fon Cina yang elegan, yang diperkenalkan oleh Google Font
• Skim Warna: Gunakan teks putih terutamanya untuk memastikan kebolehbacaan pada semua latar belakang
• Pengoptimuman Memuatkan: Malas memuatkan imej untuk meningkatkan prestasi halaman

Ciri Interaktif

• Muat semula Auto: Menukar imej latar belakang dan petikan secara automatik setiap hari
• Muat semula Manual: Menyediakan butang muat semula untuk membolehkan pengguna menukar kandungan secara manual

Gaya Copywriting

• Pemilihan Sebut Harga: Lebih suka petikan pendek, positif dan falsafah
• Gaya Bahasa: Ringkas dan berkuasa, mengelakkan kepanjangan yang berlebihan
• Klasifikasi Tema: Wawasan hidup, pertumbuhan inspirasi, pemikiran bijak, ekspresi emosi, dsb.

Sila jana tapak web HTML/CSS/JavaScript yang lengkap mengikut keperluan di atas, memastikan antara muka adalah estetik, berfungsi dan memberikan pengalaman pengguna yang baik.

Ujian ini adalah semata-mata untuk menilai pemahaman setiap model tentang estetika. Jenis halaman web berorientasikan paparan ini biasanya boleh dicapai.

Harus dikatakan bahawa Claude Opus 4 masih cukup berwibawa dalam bidang ini, dengan perhatian yang sangat baik terhadap perincian. Gemini 2.5 Pro juga bagus, malah menambahkan kesan animasi pada peralihan imej. Deepseek dan Sonnet 4 berada pada tahap yang sama.

Deepseek-R1-0528: Saya menjalankan Deepseek dahulu dan fikir ia sudah agak bagus. Isu pertama dengan estetika keseluruhan ialah butang muzik di sudut kiri bawah, yang agak terlalu rata. Bahagian petikan juga mempunyai masalah—topeng hitam tidak sepatutnya ditambahkan dan penjajaran teks agak terkeluar. Walau bagaimanapun, ia telah menambah kesan animasi untuk penyegaran.

Claude Opus 4: Estetika Opus 4 benar-benar sempurna. Saiz dan jarak semua fon adalah sangat selesa, dan petikan untuk kata-kata terkenal telah dikendalikan dengan ketelusan untuk kedua-dua teks petikan dan tanda petikan. Malah pemain Spotify telah dibalut dengan UI dengan animasi kembangkan/runtuhkan. Ia sempurna.

Claude Sonnet 4: Kesan Sonnet 4 adalah serupa dengan isu Deepseek. Butang main muzik, saiz teks, penjajaran dan jarak semuanya boleh dioptimumkan lagi.

Gemini 2.5 Pro: Kesan Gemini juga bagus, tetapi mengalih keluar bayangan teks akan menjadikannya lebih baik. Ia juga telah menyesuaikan UI pemain Spotify, dan butiran teks adalah baik. Kesan peralihan adalah ketara, dengan kesan regangan pada imej.

Ujian 5: Penjanaan halaman apl Sleep

Seterusnya ialah ujian aplikasi mudah alih. Minta mereka membuat apl pemantauan tidur. Gesaan akan menentukan susunan teknikal dan keperluan reka bentuk, dan memerlukan penjanaan berbilang halaman interaktif.

Prompt: Keperluan pembangunan aplikasi pemantauan tidur

Gambaran keseluruhan projek

Tolong bantu saya membuat aplikasi pemantauan tidur lengkap dengan empat halaman berfungsi utama. Antara muka haruslah estetik dan profesional.

Keperluan tindanan teknikal

Teknologi bahagian hadapan

– HTML5 – Struktur halaman

– TailwindCSS v3.0+ – Rangka kerja gaya (diperkenalkan melalui CDN)

– JavaScript – Logik interaksi yang diperlukan

– Anime.js v4.0.2 – Pustaka kesan animasi

• CDN: https://cdn.jsdelivr.net/npm/animejs@4.0.2/+esm

Ikon dan carta

• Pustaka ikon: Font Hebat atau Ikon Bahan (CDN)
• Komponen carta: Komponen carta dalam talian, gaya mestilah konsisten dengan tema
• Visualisasi data: Menyokong paparan carta data tidur

Keperluan reka bentuk

Reka bentuk responsif

• Reka letak responsif sepenuhnya
• Reka bentuk diutamakan mudah alih
• Paparan yang baik pada kedua-dua desktop dan peranti mudah alih

Kesan interaksi

• Interaksi butang: Kesan yang diperbesarkan sedikit pada tuding

Interaksi bentuk: Paparkan sempadan kecerunan apabila medan input difokuskan

Interaksi kad: Gelapkan bayang apabila melayang

Kesan animasi: Gunakan Anime.js untuk mencapai animasi halaman yang lancar

Keperluan Halaman Fungsian

Sila jana semua halaman yang diperlukan untuk apl pemantauan tidur, termasuk tetapi tidak terhad kepada:

• Halaman utama/papan pemuka
• Halaman rekod tidur
• Halaman analisis data
• Halaman tetapan
• Halaman berfungsi lain yang berkaitan

Keperluan Output Kod

• Setiap halaman ialah fail HTML bebas
• Struktur kod yang jelas dengan ulasan lengkap
• Pastikan semua pautan CDN boleh diakses
• Sediakan kod yang lengkap dan boleh dijalankan

Dari segi logik mudah alih dan antara muka, Cluade Opus 4 sekali lagi menunjukkan kuasanya, melengkapkan berbilang halaman dengan logik yang baik. Model lain hanya menjana satu halaman, tetapi Deepseek R1 0528 tiba-tiba mencecah tanda dari segi estetika, dengan gaya yang cantik. Walaupun ia hanya menghasilkan satu halaman, ia sangat lengkap.

Deepseek-R1-0528: Hanya menghasilkan satu halaman, tetapi estetika keseluruhannya bagus. Butiran kad dan pengendalian ikon dilakukan dengan baik, dan keseluruhan halaman adalah lengkap dan panjang. Selain itu, reka bentuk responsif telah dilaksanakan untuk navigasi, menghasilkan reka letak yang berbeza sama sekali pada peranti mudah alih dan desktop.

Claude Opus 4: Memang berkuasa, hanya Opus4 yang menjana semua halaman sepenuhnya, tetapi reka bentuk estetik kali ini tidak hebat, menggunakan logik laman web, dengan ikon navigasi yang terlalu kecil.

Claude Sonnet 4: Hanya menjana satu halaman dan melaporkan ralat, dengan reka bentuk estetik yang lemah, baru sahaja menyelesaikan tugas.

Gemini 2.5 Pro: Google sentiasa melakukan perkara secara berbeza. Ia menjana setiap halaman secara individu, menyediakan empat fail yang tidak boleh berinteraksi antara satu sama lain. Selain itu, semua halaman melaporkan ralat, dengan setiap halaman hanya mengandungi navigasi dan tiada kandungan, yang agak mengecewakan.

Ujian 6: Kefungsian Kompleks—Tetris

Akhirnya, saya selesai dengan ujian permainan kecil. Saya mereka bentuk permainan Tetris yang agak kompleks dengan blok khas, penukaran tema, ramalan pendaratan blok, penyimpanan blok dan banyak lagi—cabaran utama yang sebenar.

Gesaan: Tolong bantu saya mencipta permainan web Tetris yang berfungsi sepenuhnya dan menarik secara visual dengan keperluan berikut:

Ciri permainan teras

1. Mekanisme Tetris lengkap: 7 blok standard (I, O, T, S, Z, J, L)
2. Kawalan lancar: pergerakan kiri dan kanan, putaran, jatuh cepat, jatuh segera
3. Sistem penghapusan pintar: menyokong penghapusan 1-4 baris pada satu masa dengan kesan animasi khas
4. Sistem kesukaran progresif: secara automatik meningkatkan kelajuan dan tahap jatuh berdasarkan bilangan baris yang dihapuskan

Ciri lanjutan

1. Sistem pratonton: memaparkan blok seterusnya dan seterusnya seterusnya
2. Fungsi Tahan: Pegang kekunci Tahan untuk menyimpan sementara blok semasa. Hanya boleh digunakan sekali setiap pusingan
3. Blok Hantu: Memaparkan kedudukan pendaratan blok dalam bentuk separa lutsinar
4. Sistem Kombo: Pembersihan berterusan memberikan mata tambahan dan kesan visual
5. Kemahiran Khas:
   1. Blok Bom (membersihkan kawasan sekitar)
   2. Laser Clear (kosongkan keseluruhan baris)
   3. Jeda Masa (blok berhenti jatuh selama 3 saat)

Keperluan Reka Bentuk Visual

1. Antara Muka UI Moden:
   1. Latar belakang kecerunan atau kesan zarah
   2. Panel permainan kesan kaca
   3. Peralihan animasi yang lancar
   4. Reka bentuk responsif untuk skrin yang berbeza
2. Kesan visual yang kaya:
   1. Animasi lancar blok jatuh dan berputar
   2. Kesan letupan atau denyar apabila dihapuskan
   3. Kesan gegaran skrin apabila kombo dicapai
   4. Animasi perayaan apabila tahap dinaik taraf
3. Sistem tema: Sekurang-kurangnya 3 tema visual yang berbeza untuk bertukar antara

Sistem kesan bunyi

1. Maklum balas bunyi yang lengkap: pergerakan, putaran, pendaratan, penyingkiran, tamat permainan, dsb.
2. Muzik latar belakang: permainan gelung BGM
3. Kawalan kelantangan: kesan bunyi boleh laras bebas dan kelantangan muzik latar belakang

Mod permainan

1. Mod klasik: permainan tradisional Tetris
2. Mod terhad masa: mencapai markah tertinggi dalam had masa yang ditetapkan
3. Mod cabaran: halangan yang telah ditetapkan untuk meningkatkan kesukaran
4. Mod Zen: tiada tekanan masa, keseronokan murni permainan

Ciri statistik data

1. Statistik masa nyata: skor semasa, tahap, bilangan garisan yang dibersihkan, masa permainan
2. Sejarah: skor tertinggi, tahap terbaik, jumlah masa permainan
3. Sistem pencapaian: membuka kunci pelbagai pencapaian permainan
4. Storan tempatan: simpan rekod dan tetapan permainan

Keperluan teknikal

1. Menggunakan HTML5/CSS3/JavaScript tulen, tiada rangka kerja luaran diperlukan
2. Struktur kod yang jelas: pengaturcaraan berorientasikan objek, reka bentuk modular
3. Pengoptimuman prestasi: animasi 60FPS lancar, tiada lag
4. Keserasian: menyokong pelayar moden arus perdana
5. Reka bentuk responsif: Serasi dengan PC dan peranti mudah alih

Pengalaman pengguna

1. Arahan intuitif: Tutorial terbina dalam dan gesaan butang
2. Fungsi jeda/sambung semula: Jeda permainan pada bila-bila masa
3. Menu tetapan: Laraskan kesukaran permainan, kesan bunyi, kesan visual, dsb.
4. Penjimatan keadaan permainan: Menyokong menyimpan dan menyambung semula permainan

Keperluan kualiti kod

1. Komen terperinci: Setiap fungsi dan segmen kod penting mesti mempunyai penerangan
2. Ralat pengendalian: Mekanisme penangkapan dan pengendalian pengecualian yang komprehensif
3. Kod yang elegan: Ikut amalan terbaik, mudah difahami dan diselenggara
4. Kebolehlanjutan: Mudah untuk menambah ciri baharu pada masa hadapan

Sila berikan fail HTML lengkap yang mengandungi semua kod CSS dan JavaScript untuk memastikan ia boleh dijalankan terus dalam penyemak imbas. Kod tersebut harus menunjukkan kemahiran pengaturcaraan profesional dan pemahaman yang mendalam tentang pembangunan permainan.

Dalam permainan mini, Claude mempunyai sesuatu yang berlaku. Kedua-dua Opus dan Sonnet menghasilkan blok Tetris yang sepadan seperti yang diperlukan, terutamanya logik untuk blok khas. Deepseek mengendalikan tema yang Claude terlepas pandang, tetapi terlepas blok khas, menyebabkan Gemini 2.5 Pro menjana blok tidak boleh dimainkan.

Deepseek-R1-0528: Tugasan telah disiapkan dengan baik dan mengikut spesifikasi, tetapi reka bentuk blok khas telah ditinggalkan dan tidak dilaksanakan sama sekali. Ini mungkin disebabkan oleh isu mengikut kata-kata gesaan. Seluruh halaman web menyerupai antara muka permainan, dengan semua butang kelihatan seperti komponen standard.

Claude Opus 4: Menyelesaikan logik untuk blok khas dan logik lain tanpa masalah, tetapi mengabaikan gesaan untuk menukar tema, yang dia tidak laksanakan. Berbanding dengan isu DeepSeek, ini adalah masalah yang lebih kecil, tetapi antara muka dikodkan keras tanpa logik responsif, jadi perkadarannya sedikit terkeluar, menjadikan beberapa butang tidak boleh diklik.

Claude Sonnet 4: Sama seperti Opus, tetapi saya rasa Sonnet 4 lebih baik daripada Opus. Penyesuaian halaman juga bagus. Ini terasa seperti Sonnet menang, kerana ia menyelesaikan semua fungsi yang diperlukan.

Gemini 2.5 Pro: Gemini secara konsisten bergelut dengan logik yang kompleks. Kali ini, ia tidak boleh digunakan sama sekali kerana peletakan batu bata mempunyai pepijat, menjadikannya mustahil untuk meramalkan di mana ia akan mendarat. Ia adalah yang paling teruk.

Sekarang, saya rasa anda sama kagum dengan saya dengan prestasi DeepSeek-R1.

Sukar untuk mempercayai ini hanyalah peningkatan model kecil. Mari bandingkan harga model ini dengan DeepSeek R1 0528.

Opus 4 adalah 30 kali lebih mahal, dan itu menggunakan harga Openrouter—harga rasmi akan menjadi lebih mengejutkan.

model	Panjang konteks	Harga input($/M token)	Harga output($/M token)	harga imej($/K token)
DeepSeek R1 0528	160k	0.50	2.18	–
Pratonton Gemini 2.5 pro	1000k	1.25	10	5.16
Claude Sonnet 4	200k	3.00	15	4.80
Claude Opus 4	200k	15.00	75	24.00

Sebagai seseorang yang berurusan dengan berita AI setiap hari, saya telah menyaksikan banyak "kejayaan" yang akhirnya menjadi "mengecewakan". Tetapi kali ini berbeza. DeepSeek-R1 telah memberi saya harapan yang sebenar.

Perbezaan harga 30 kali ganda namun prestasi yang hampir setara.

Kami tidak perlu lagi membayar harga yang terlalu tinggi untuk menggunakan model pengaturcaraan AI terbaik, dan kami juga tidak perlu membuat pertukaran yang menyakitkan antara kos dan kualiti. Apa yang lebih memberi inspirasi ialah ini model kami sendiri.

Ayat ini ditulis oleh AI, dan saya rasa ia bagus: Revolusi sebenar selalunya bermula apabila orang biasa boleh mencapai bintang.