pages/23_V.3._Dépanner les problèmes mathématiques.py

import streamlit as st
st.set_page_config(layout="wide")
from streamlit_extras.switch_page_button import switch_page

st.markdown(r"""
## Dépanner les problèmes mathématiques
""")
st.markdown(""" """)
st.markdown(""" """)
st.markdown("""### Utilisation de $\LaTeX$ pour évaluer sur le jeu d'évaluation MATH""")
st.markdown(""" """)
st.markdown("""
Parser le $\LaTeX$ est difficile. C'est un problème pour évaluer un modèle qui en attend en sortie. C'est le cas du [jeu d'évaluation MATH](https://huggingface.co/datasets/lighteval/MATH) qui l'utilise pour représenter des calculs et des symboles mathématiques. L'évaluation de cette tâche consiste à analyser les références et les résultats du modèle.  

Il s'avère qu'il n'y a pas de bonne façon d'analyser le $\LaTeX$ :
""", unsafe_allow_html=True)
st.markdown(""" """)
st.image("./assets/sympy_doc.png", caption="Tiré de la documentation de la bibliothèque SymPy", use_container_width=True)
st.markdown(""" """)
st.markdown(r"""
La librairie [lm-evaluation-harness](https://github.com/EleutherAI/lm-evaluation-harness) utilise [SymPy](https://github.com/sympy/sympy) (une bibliothèque Python pour les mathématiques symboliques) pour analyser le $\LaTeX$ et comparer les expressions.  
Lorsque l'on utilise SymPy pour essayer d'analyser les références (contre elles-mêmes), nous n'obtenons qu'une *accuracy* d'environ 0,94.
Comment cela est-il possible ? Il s'avère que SymPy ne peut pas analyser certaines expressions (correctes en $\LaTeX$).

Par exemple : 

```
couldn't parse one of [0,1) or [0,1), I expected one of these: ']'
[0,1)
~~^
```
```
couldn't parse one of (-\iny,-5]\cup[5,\iny) or (-\iny,-5]\cup[5,\iny), I expected something else here
(-\iny,-5]\cup[5,\iny)
~~~~~~^
```
```
couldn't parse one of -\frac{1}{{}2x} or -\frac{1}{{}2x}, I don't understand this
-\frac{1}{{}2x}
~~~~~~~~~~~^
```
""", unsafe_allow_html=True)
st.markdown(""" """)
st.markdown(""" """)
st.markdown(""" """)
st.markdown(r"""
##### Comment contourner ce problème ?

Vous pouvez soit réécrire la [grammaire](https://github.com/sympy/sympy/blob/master/sympy/parsing/latex/lark/grammar/latex.lark) de $\LaTeX$ en ajoutant les fonctionnalités nécessaires au code, soit ajouter des vérifications manuelles à votre code pour améliorer les scores des modèles. Nous avons opté pour cette seconde option chez Hugging Face.
""", unsafe_allow_html=True)
st.markdown(""" """)
st.image("./assets/lm_eval_diff.png", caption="Correction appliquée au code de LM Evaluation Harness")
st.markdown(""" """)
st.markdown(""" """)
st.markdown(""" """)
st.markdown(r"""
#####  Résultats

Le tableau suivant compare les anciens et les nouveaux résultats des 25 premiers modèles sur le jeu d'évaluation :

<div id="xdihwljbql" style="padding-left:0px;padding-right:0px;padding-top:10px;padding-bottom:10px;overflow-x:auto;overflow-y:auto;width:auto;height:auto;">
<table class="gt_table" data-quarto-disable-processing="false" data-quarto-bootstrap="false">
<thead>
  <tr class="gt_heading">
    <td colspan="5" class="gt_heading gt_title gt_font_normal">Comparaison du parseur original et corrigé sur le jeu d'évaluation MATH</td>
  </tr>
<tr class="gt_col_headings gt_spanner_row">
  <th class="gt_col_heading gt_columns_bottom_border gt_left" rowspan="2" colspan="1" scope="col" id="Modèle">Modèle</th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="2" scope="colgroup" id="Score">
    <span class="gt_column_spanner">Score</span>
  </th>
  <th class="gt_center gt_columns_top_border gt_column_spanner_outer" rowspan="1" colspan="2" scope="colgroup" id="Rang">
    <span class="gt_column_spanner">Rang</span>
  </th>
</tr>
<tr class="gt_col_headings">
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Parseur original">Parseur original</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Parseur corrigé">Parseur corrigé</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Parseur original">Parseur original</th>
  <th class="gt_col_heading gt_columns_bottom_border gt_right" rowspan="1" colspan="1" scope="col" id="Parseur corrigé">Parseur corrigé</th>
</tr>
</thead>
<tbody class="gt_table_body">
  <tr>
    <td class="gt_row gt_left">rombodawg/Rombos-LLM-V2.5-Qwen-72b</td>
    <td class="gt_row gt_right">47,58</td>
    <td class="gt_row gt_right">50,68</td>
    <td style="color: #FFFFFF; background-color: #000000;" class="gt_row gt_right">1</td>
    <td style="color: #FFFFFF; background-color: #000000;" class="gt_row gt_right">1</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">MaziyarPanahi/calme-2.2-qwen2-72b</td>
    <td class="gt_row gt_right">41,16</td>
    <td class="gt_row gt_right">43,43</td>
    <td style="color: #FFFFFF; background-color: #41181f;" class="gt_row gt_right">2</td>
    <td style="color: #FFFFFF; background-color: #41181f;" class="gt_row gt_right">2</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">arcee-ai/Arcee-Nova</td>
    <td class="gt_row gt_right">40,48</td>
    <td class="gt_row gt_right">42,90</td>
    <td style="color: #FFFFFF; background-color: #82303e;" class="gt_row gt_right">3</td>
    <td style="color: #FFFFFF; background-color: #82303e;" class="gt_row gt_right">3</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">fblgit/TheBeagle-v2beta-32B-MGS</td>
    <td class="gt_row gt_right">39,43</td>
    <td class="gt_row gt_right">42,52</td>
    <td style="color: #FFFFFF; background-color: #c3495e;" class="gt_row gt_right">4</td>
    <td style="color: #FFFFFF; background-color: #c3495e;" class="gt_row gt_right">4</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">rombodawg/Rombos-LLM-V2.5-Qwen-32b</td>
    <td class="gt_row gt_right">39,12</td>
    <td class="gt_row gt_right">41,99</td>
    <td style="color: #000000; background-color: #ca6866;" class="gt_row gt_right">5</td>
    <td style="color: #000000; background-color: #ca6866;" class="gt_row gt_right">5</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">dnhkng/RYS-XLarge</td>
    <td class="gt_row gt_right">38,97</td>
    <td class="gt_row gt_right">41,24</td>
    <td style="color: #000000; background-color: #a58c5e;" class="gt_row gt_right">6</td>
    <td style="color: #000000; background-color: #a58c5e;" class="gt_row gt_right">6</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">dfurman/CalmeRys-78B-Orpo-v0.1</td>
    <td class="gt_row gt_right">37,92</td>
    <td class="gt_row gt_right">40,71</td>
    <td style="color: #000000; background-color: #6ec352;" class="gt_row gt_right">8</td>
    <td style="color: #000000; background-color: #80b156;" class="gt_row gt_right">7</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">MaziyarPanahi/calme-2.2-rys-78b</td>
    <td class="gt_row gt_right">37,92</td>
    <td class="gt_row gt_right">39,95</td>
    <td style="color: #000000; background-color: #6ec352;" class="gt_row gt_right">8</td>
    <td style="color: #000000; background-color: #4cbd81;" class="gt_row gt_right">9</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">MaziyarPanahi/calme-2.4-rys-78b</td>
    <td class="gt_row gt_right">37,69</td>
    <td class="gt_row gt_right">40,41</td>
    <td style="color: #000000; background-color: #4cbd81;" class="gt_row gt_right">9</td>
    <td style="color: #000000; background-color: #5ece55;" class="gt_row gt_right">8</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">MaziyarPanahi/calme-2.3-rys-78b</td>
    <td class="gt_row gt_right">36,56</td>
    <td class="gt_row gt_right">38,97</td>
    <td style="color: #000000; background-color: #3aacad;" class="gt_row gt_right">10</td>
    <td style="color: #000000; background-color: #3aacad;" class="gt_row gt_right">10</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">MaziyarPanahi/calme-2.1-rys-78b</td>
    <td class="gt_row gt_right">36,40</td>
    <td class="gt_row gt_right">38,90</td>
    <td style="color: #000000; background-color: #279cd9;" class="gt_row gt_right">11</td>
    <td style="color: #000000; background-color: #279cd9;" class="gt_row gt_right">11</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Qwen/Qwen2.5-72B</td>
    <td class="gt_row gt_right">36,10</td>
    <td class="gt_row gt_right">38,67</td>
    <td style="color: #000000; background-color: #23a7e6;" class="gt_row gt_right">12</td>
    <td style="color: #000000; background-color: #23a7e6;" class="gt_row gt_right">12</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">MaziyarPanahi/calme-2.1-qwen2-72b</td>
    <td class="gt_row gt_right">36,03</td>
    <td class="gt_row gt_right">38,07</td>
    <td style="color: #000000; background-color: #25bce6;" class="gt_row gt_right">13</td>
    <td style="color: #000000; background-color: #36d0e2;" class="gt_row gt_right">15</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Qwen/Qwen2-Math-72B-Instruct</td>
    <td class="gt_row gt_right">35,95</td>
    <td class="gt_row gt_right">38,14</td>
    <td style="color: #000000; background-color: #27d2e5;" class="gt_row gt_right">14</td>
    <td style="color: #000000; background-color: #27d2e5;" class="gt_row gt_right">14</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">dfurman/Qwen2-72B-Orpo-v0.1</td>
    <td class="gt_row gt_right">35,42</td>
    <td class="gt_row gt_right">38,14</td>
    <td style="color: #000000; background-color: #36d0e2;" class="gt_row gt_right">15</td>
    <td style="color: #000000; background-color: #25bce6;" class="gt_row gt_right">13</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">abacusai/Smaug-Qwen2-72B-Instruct</td>
    <td class="gt_row gt_right">35,35</td>
    <td class="gt_row gt_right">37,46</td>
    <td style="color: #000000; background-color: #6691d6;" class="gt_row gt_right">16</td>
    <td style="color: #000000; background-color: #d73a91;" class="gt_row gt_right">19</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">anthracite-org/magnum-v1-72b</td>
    <td class="gt_row gt_right">35,27</td>
    <td class="gt_row gt_right">37,69</td>
    <td style="color: #FFFFFF; background-color: #ae33c4;" class="gt_row gt_right">18</td>
    <td style="color: #000000; background-color: #7e72d0;" class="gt_row gt_right">16</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">alpindale/magnum-72b-v1</td>
    <td class="gt_row gt_right">35,27</td>
    <td class="gt_row gt_right">37,69</td>
    <td style="color: #FFFFFF; background-color: #ae33c4;" class="gt_row gt_right">18</td>
    <td style="color: #000000; background-color: #7e72d0;" class="gt_row gt_right">16</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Qwen/Qwen2-72B-Instruct</td>
    <td class="gt_row gt_right">35,12</td>
    <td class="gt_row gt_right">37,69</td>
    <td style="color: #000000; background-color: #d73a91;" class="gt_row gt_right">19</td>
    <td style="color: #FFFFFF; background-color: #c614be;" class="gt_row gt_right">18</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">dnhkng/RYS-XLarge-base</td>
    <td class="gt_row gt_right">34,67</td>
    <td class="gt_row gt_right">37,16</td>
    <td style="color: #000000; background-color: #e3715f;" class="gt_row gt_right">20</td>
    <td style="color: #000000; background-color: #e3715f;" class="gt_row gt_right">20</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Undi95/MG-FinalMix-72B</td>
    <td class="gt_row gt_right">33,61</td>
    <td class="gt_row gt_right">36,10</td>
    <td style="color: #000000; background-color: #f4c314;" class="gt_row gt_right">22</td>
    <td style="color: #000000; background-color: #eea82d;" class="gt_row gt_right">21</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">abacusai/Dracarys-72B-Instruct</td>
    <td class="gt_row gt_right">33,61</td>
    <td class="gt_row gt_right">35,65</td>
    <td style="color: #000000; background-color: #f4c314;" class="gt_row gt_right">22</td>
    <td style="color: #000000; background-color: #eac222;" class="gt_row gt_right">22</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">Qwen/Qwen2.5-32B</td>
    <td class="gt_row gt_right">32,85</td>
    <td class="gt_row gt_right">35,50</td>
    <td style="color: #000000; background-color: #d1b64b;" class="gt_row gt_right">23</td>
    <td style="color: #000000; background-color: #d1b64b;" class="gt_row gt_right">23</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">anthracite-org/magnum-v2-72b</td>
    <td class="gt_row gt_right">31,65</td>
    <td class="gt_row gt_right">34,06</td>
    <td style="color: #000000; background-color: #b7aa75;" class="gt_row gt_right">24</td>
    <td style="color: #000000; background-color: #b7aa75;" class="gt_row gt_right">24</td>
  </tr>
  <tr>
    <td class="gt_row gt_left">dnhkng/RYS-Huge-bnb-4bit</td>
    <td class="gt_row gt_right">31,57</td>
    <td class="gt_row gt_right">33,84</td>
    <td style="color: #000000; background-color: #9e9e9e;" class="gt_row gt_right">25</td>
    <td style="color: #000000; background-color: #9e9e9e;" class="gt_row gt_right">25</td>
  </tr>
</tbody>
</table>
</div>
""", unsafe_allow_html=True)
st.markdown(""" """)
st.markdown(""" """)
st.markdown(""" """)
st.markdown("""### Correction du *leaderboard Open LLM* avec Math-Verify""")
st.markdown(""" """)
st.success("""Pendant de la traduction du guide, Hugging Face a publié un [article de blog](https://huggingface.co/blog/math_verify_leaderboard) sur l'utilisation de sa bibliothèque [Math-Verify](https://github.com/huggingface/Math-Verify) pour améliorer l'évaluation des capacités mathématiques des modèles de l'[*Open LLM Leaderboard*](https://huggingface.co/spaces/open-llm-leaderboard/open_llm_leaderboard).  
Nous avons décidé d'ajouter ci-dessous un résumé de cet article de blog qui n'est pas présent dans le guide de Clémentine.""")
st.markdown(""" """)
st.markdown("""##### Pourquoi l'évaluation des mathématiques dans l'*Open LLM Leaderboard* était défaillante ?

Une des taches d’évaluation de l’[*Open LLM Leaderboard*](https://huggingface.co/spaces/open-llm-leaderboard/open_llm_leaderboard), appelée MATH-Hard, porte spécifiquement sur les problèmes de mathématiques : elle évalue la capacité des LLM à résoudre des problèmes de mathématiques de niveau secondaire et universitaire, soit 1 324 problèmes répartis sur 7 sujets (pré-calcul, pré-algébre, algèbre, algèbre intermédiaire, comptage/probabilité et théorie des nombres), en utilisant une approche 5-*shot* (le modèle reçoit 5 exemples dans l'instruction pour montrer comment il devrait répondre).  

Une question typique se présente comme suit :
```
For all real numbers $r$ and $s$, define the mathematical operation $\#$ such that the following conditions apply: $r\ \#\ 0 = r, r\ \#\ s = s\ \#\ r$, and $(r + 1)\ \#\ s = (r\ \#\ s) + s + 1$. What is the value of $11\ \#\ 5$?

# En français
Pour tous les nombres réels $r$ et $s$, on définit l'opération mathématique $\#$ telle que les conditions suivantes s'appliquent : $r\ \#\ 0 = r, r\ \#\ s = s\ \#\ r$, and $(r + 1)\ \#\ s = (r\ \#\ s) + s + 1$. Quelle est la valeur de $11 \#5$ ?
```
et  la réponse attendue est
```
71
```

Dans le classement, les modèles doivent terminer leurs réponses par une chaîne de caractères très spécifique (suivant [Minerva-Math](https://arxiv.org/abs/2206.14858)) :
```
“Final answer is [ANSWER]. I hope it is correct.”.
# “La réponse finale est [ANSWER]. J'espère qu'elle est correcte.”.
```

Le classement essayait alors d'analyser `[ANSWER]` avec [SymPy](https://docs.sympy.org/latest/index.html) pour le convertir en une représentation symbolique (et simplifier les valeurs si nécessaire), avant de le comparer à la réponse attendue. Toutefois, les utilisateurs ont signalé un certain nombre de problèmes. 

Tout d'abord, un problème récurrent était l'incapacité de certains modèles à suivre le format de réponse attendu des exemples : ils produisaient d'autres phrases à la place pour introduire leurs réponses. Comme le format n'était pas respecté, les réponses étaient marquées comme fausses même si elles étaient en fait correctes !


| 📄 Exemple |  ❗️ Problème | ✅ Math-Verify | 🛑 Ancien Leaderboard |
| --- | --- | --- | --- |
| Par conséquent, le périmètre de l'un de ces triangles est de $14 + 7\sqrt{2}$ pouces, exprimé sous la forme la plus simple | Échec de l'extraction | `7*sqrt(2) + 14` | None |
| Par conséquent, la somme de la série géométrique infinie est  frac{7}{9}. | Échec de l'extraction | `7/9` | None |
| \( p(n) \) et  \( p(n+1) \) partagent un facteur commun supérieur à 1 qui est boxed{41}. | Échec de l'extraction | `4` | None |

L'étape suivante, la conversion de `[ANSWER]` en représentation symbolique, a également posé quelques problèmes, cette fois liés à SymPy :

| 📄 Exemple |  ❗️ Problème | ✅ Math-Verify | 🛑 Ancien Leaderboard |
| --- | --- | --- | --- |
| La réponse finale est $2x + 4y + z - 19 = 0$. J'espère que c'est correct. | Analyse partielle de l'équation paramétrique | Eq(2*x + 4*y + z - 19, 0) | 0 |
| \(23\) | Échec de l'extraction en raison des balises LaTeX | `23` | None |
| \((- \infty, -14) \cup (-3, \infty)\). | Échec de l'extraction en raison de l'intervalle | Union(Interval.open(-oo, -14), Interval.open(-3, oo)) | None |

Lors de la dernière étape, la comparaison de la réponse extraite avec la réponse attendue posé un certain nombre de problèmes :
| 📄 Exemple |  ❗️ Problème | ✅ Math-Verify | 🛑 Ancien Leaderboard |
| --- | --- | --- | --- |
| 1/3 == 0.333333 | Pas de support pour les arrondis | OK | KO |
| sqrt(1/2)*7 == sqrt(0.5)*7 | Pas de support d'évaluation numérique | OK | KO |
| k = 1 == 1 | Pas de prise en charge de l'affectation de variables | OK | KO |

**Tous ces problèmes sont maintenant complètement résolus avec le nouveau parseur de Math-Verify !**
""", unsafe_allow_html=True)
st.markdown(""" """)
st.markdown("""##### Une redistribution complète des modèles grâce à des évaluations plus équitables
Ces corrections ont complètement remanié les 20 premiers modèles du sous-ensemble MATH du classement.  
En moyenne, les modèles ont résolu **61 problèmes** de plus, ce qui équivaut à une augmentation de **4,66 points** !
""", unsafe_allow_html=True)
st.image('./assets/score-change.png')
st.markdown(""" """)
st.markdown("""
Les deux sous-ensembles qui ont montré l'amélioration la plus significative étaient tous deux liés à l'algèbre (algèbre et pré-algèbre) avec des gains de **8,27** et **6,93**, respectivement. Dans les cas extrêmes, certains modèles ont montré des améliorations de près de **90** points sur ces sous-ensembles.
Nous pensons que ces sous-ensembles ont connu la plus grande amélioration parce qu'ils impliquent fréquemment des réponses présentées sous forme d'ensembles (en raison des questions à solutions multiples) et de matrices. Math-Verify a amélioré sa gestion des deux types de réponses, ce qui a contribué à ces gains notables.
""", unsafe_allow_html=True)
st.image('./assets/subset-change.png')
st.markdown(""" """)
st.markdown("""
Concernant le classement, **AceMath de Nvidia** domine désormais MATH-Hard (février 2025).
Un autre grand bénéficiaire de ce changement sont les dérivés de **Qwen**, qui sont maintenant presque exclusivement les seuls modèles classés juste en dessous d'AceMath.
Voici le tableau complet comparant l'ancien et le nouveau classement du Top 20 :
""", unsafe_allow_html=True)
st.image('./assets/math-hard-change.png')
st.markdown(""" """)
st.markdown(""" """)
st.markdown("""##### En résumé
Les développeurs et les chercheurs sont encouragés à adopter Math-Verify pour leurs propres évaluations mathématiques. Ce faisant, vous pouvez vous assurer que vos modèles sont évalués avec des résultats plus fiables. Par ailleurs, nous vous invitons à consulter les classements mis à jour et à constater l'évolution des performances de vos modèles préférés.
""")
st.markdown(""" """)
st.markdown(""" """)
st.markdown(""" """)
col1, col2, col3= st.columns(3)
with col1:
    if st.button('Section précédente', use_container_width=True):
        switch_page("V.2._Dépanner la reproductibilité")
with col2:
    if st.button("Accueil", use_container_width=True):
        switch_page("Home")
with col3:
    if st.button("Section suivante", use_container_width=True):
        switch_page("Notebook")