codante-io / rinha-frontend Goto Github PK
View Code? Open in Web Editor NEWRepositório oficial da Rinha de Front-end
License: GNU General Public License v3.0
Repositório oficial da Rinha de Front-end
License: GNU General Public License v3.0
De certo modo consegui carregar quase todos, exceto o giant.json
😅. Estou em dúvidas sobre as estratégias de carregamento. Hoje eu inicio o objeto fechado, ou seja com todos os filhos fechados e vou abrindo conforme necessário. Mas atualmente quando eu envio o json no campo eu alimento o estado com a totalidade do json, até aí ok, aparentemente, mas quando expande os dados aí ele trava. Enfim. O que fazer?
Estou usando React, TS com Vite e tailwind.
Ja fiz o deploy nester link
Não sou do frontend então, uso o navegador mais para acessar. Meu navegador padrão é o Firefox e tudo funcionou perfeitamente até o large.
Basicamente usei createElement, innerText e appendChild (UL, LI, SPAN, , )
Mesmo com 16G de RAM, o aquivo não abriu no Opera nem no Chromium que informou erro SIGILL (procurando na internet existem diversos casos).
Usei uma configuração mosdesta para testar em uma VirtualBox com Mabox (baseada no manjaro) com 4G da RAM e dois processadores. O Firefox funcionou bem e ainda deixou 1G livre de memória. Nem preciso dizer que os navegadores baseados no Chrome falharam.
Finalmente usei um laptop com Windows e 8G RAM. O Firefox carregou em 6s, funcionou corretamente e ainda deixou 2,2G livres. O Microsoft Edge levou 10s e usou toda a memória. Quando fui expandir/contrair os elementos ele travou. Pelo menos mostrou uma mensagem mais legível (out of memory).
Foram 1.787.115 tags criadas. Alguma forma de obter mais informação sobre o erro?
Participar da rinha é um desafio enorme para mim pois todos os temas abordados são novos, estarei aprendendo em tempo de desenvolvimento. Sendo assim queria manter na aplicação final todas as soluções que irei desenvolver até o dia 31, eu posso fazer isso? A minha ideia era manter a versão final para ser avaliada na página home da aplicação e as demais em outras páginas com botões navegáveis para cada uma delas. Porém fico com dúvida sobre manter todo esse código, pois acho que afetaria na hora de analise da entrega final de alguma forma, como por exemplo na acessibilidade. Ou é melhor fazer essa documentação de etapas de uma outra forma, como por exemplo utilizando branchs exclusivas para cada uma delas e fazendo o deploy apenas da branch com a versão final do código?
O Layout da Rinha de Front-end precisa seguir exatamente o que está no figma ou é so para ter uma base ? Por exemplo eu posso estilizar das cores ou fontes que eu quiser etc ...
Na descrição do projeto não fica claro se é necessário ou não adicionar collapse pros subíveis de objetos/arrays. Será necessário ou só precisa mostrar tudo abertão mesmo?
Li todo o READMe do projeto e não achei por onde me inscrever na rinha (https://codante.io/mini-projetos/rinha-frontend). Cheguei primeiro por aqui e tive que procurar no Google onde me inscrever. Sei que não é um grande esforço, mas uns cliques a menos sempre deixa todo mundo mais feliz.
Gostaria de alterar o link de submissão, pus o errado, era pra ser esse: https://victortbezerra.github.io/rinha-frontend/
Boa noite!
Quando será divulgado o resultado final?
Adicionar no formulário de submissão:
Fiz uma correção no projeto mas havia marquei como finalizado.
A versão de https://guaracy.github.io/rinha-frontend/ está corrigida.
Se foi feito download dos .arquivos (html,. css, .js) estarão incorretos. Se for direto pelo gh-pages está ok.
Obrigado.
Vale presente Kabum
1 - 200
2 - 150
3 - 100
4 - 50
5 - 50
Como os requisitos são amplos e robustos, como acessibilidade e otimização para apresentar o arquivo na tela, eu estou com dúvida se posso montar apenas o README da aplicação após o dia final da submissão da minha solução. Porque assim eu iria alocar o tempo que terei até o dia 31/10 para evoluir a minha solução e após isso apenas construir o README do meu repositório, compartilhando meus aprendizados e como a aplicação funciona. Posso fazer isso?
No exemplo do Figma, que usa o arquivo alltypes.json
, é possível ver que:
weight
são inteiros (67 e 77);children
incluem sobrenomes ("Suri Cruise" e "Indio Falconer Downey", por exemplo).Contudo, no alltypes.json disponível no Drive, os valores de weight
são floats (67.5 e 77.1), e os valores do array children
não incluem sobrenomes ("Suri" e "Indio Falconer", por exemplo).
É esperado que tratemos esses valores para que eles sejam exibidos como no exemplo do Figma?
Codifiquei minha primeira solução para a rinha e estou testando quais arquivos ela é capaz de renderizar. Ao submeter o arquivo invalid.json para renderização apareceu esse erro:
Fui verificar a estrutura do arquivo e faltava a chave de fechamento "}" no final do arquivo. Após adicionar essa chave no arquivo e salvar a alteração a renderização rodou corretamente. Alô @icaroharry e @felippe-regazio, estou pronta pra abrir esse PR e ter minha fotinha ali no repositório como contribuidora em. Uma chave abre muitas portas 😁
O objetivo é apenas mostrar o json formatado ou precisa fazer o collapse/expand dos valores de array e objetos?
Estava trabalhando num repositório privado antes de fazer o fork, que estava sendo feito deploy para a URL json-tree-viewer.pages.dev
, mas agora que eu fiz o fork do repositório da rinha e troquei o nome do projeto no CloudFlare, o domínio passou a ser rinha-frontend.pages.dev
. Não consegui encontrar nenhuma opção para trocar a URL da submissão no side da Codante.
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.